ZeroClipboard複製內容到剪貼簿的使用
阿新 • • 發佈：2019-01-27
1、第一步，引用 ZeroClipboard.js 檔案：
<script type="text/javascript" src="ZeroClipboard.js"></script>
注意：同時，還需要引用jquery的js檔案。
2、再設定 ZeroClipboard.swf 檔案的路徑：
ZeroClipboard.setMoviePath("ZeroClipboard.swf");
注意： ZeroClipboard.js, ZeroClipboard.swf 兩個檔案的路徑都需要替換為你專案中對應檔案的路徑。
3、程式碼如下：
HTML程式碼如下：var clip = null; ZeroClipboard.setMoviePath("../../_js/ZeroClipboard.swf"); $().ready(function() { init("www.baidu.com", "da_clip_button"); }); function init(text1, glue) { clip = new ZeroClipboard.Client(); // 新建一個物件 clip.setHandCursor(true); // 設定滑鼠為手型 clip.addEventListener('load', function(client) { }); clip.addEventListener('mouseOver', function(client, text) { client.setText(text1); // 設定要複製的文字。 }); clip.addEventListener('complete', function(client) { alert("複製到剪貼簿成功"); }); clip.glue(glue); }
<body> <div style="margin: 30px 10px 10px 10px; text-align: center" width="100%" cellspacing="0" border="0" cellpadding="2"> <input id="viewUrl" type="text" disabled="true" style="width: 450px" readonly="true" value="www.baidu.com" /> <br /> <button id="da_clip_button" style="margin-top: 10px;" title="複製內容到剪下板">複製內容</button> </div> </body>
注意：其他更加詳細的函式使用，可以參考如下網站