Copy to Clipboard, vanila js

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>JS Bin</title> </head> <body> <div class="header"> <img src="" alt="jstips"> </div> <div class="content"> <h1>Copy to clipboard example</h1> <input type="text" id="visible-input" value="JS Tips Rocks!"/> <input type="button" id="visible-button" value="Copy"> </div> <p class="footer">Complete post <a href="" target="_blank">here</a>.</p> </body> </html>
body { font-family:Helvetica, Aria, sans-serif; } .header { height: 80px; background: #F8DA59 } .header img { height: 100% } h1 { font-size: 19px; } input[type="text"] { padding: 5px; font-size: 15px; float: left } input[type="button"] { border: 0px; font-size: 12px; padding: 8px; } .footer { font-size: 11px }
// Copy to clipboard example document.querySelector("#visible-button").onclick = function() { // Select the content document.querySelector("#visible-input").select(); // Copy to the clipboard document.execCommand('copy'); };
Expand for more options Login