<!DOCTYPE html> <!-- <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> --> <head> <meta charset="utf-8"> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title>ZeroClipboard(複製功能)</title> </head> <body> <label for="cardid">卡號:</label> <input type="text" name="cardid" id="cardid" value="123456789" readonly="readonly" /> <button id="copycardid">點擊複製卡號</button> </body> </html> <script type="text/javascript" src="jquery.min.js"></script> <script type="text/javascript" src="ZeroClipboard.js"></script> <script type="text/javascript"> $(function(){ init(); }); function init() { // ZeroClipboard.setMoviePath( "ZeroClipboard.swf" ); var clip = new ZeroClipboard.Client(); // 新建一個對象 clip.setHandCursor( true ); clip.setText($('#cardid').val()); // 設置要複製的文本。 clip.addEventListener( "mouseUp", function(client) { alert("複製卡號成功!"); }); // 註冊一個 button,參數爲 id。點擊這個 button 就會複製。 //這個 button 不必定要求是一個 input 按鈕,也能夠是其餘 DOM 元素。 clip.glue("copycardid"); // 和上一句位置不可調換 } </script>
須要引入 ZeroClipboard.js 和 ZeroClipboard.swf,同時網站處於發佈狀態或者在本地有搭建好的服務器,單純的運行頁面是沒法使用的。javascript