在網上搜了搜IE用window.clipboardData API那其他瀏覽器怎麼實現呢？

一大堆說用ZeroClipboard外掛  我下載了這個外掛按流程來竟然沒成功！在各種瀏覽器都失敗！

後來才知道這玩意要放到伺服器環境中使用，不能在本地測試（欲哭無淚。。。。）

另外提示下 下載ZeroClipboard 地址   https://github.com/zeroclipboard/zeroclipboard

下載的時候有個dist檔案 裡面的ZeroClipboard.js   ZeroClipboard

所以喲 只引入一個ZeroClipboard.js是不行的！

ZeroClipboard使用案例

1 <input type="text" name="" id="J_TextIn" value="Copy Test.">
2 <input type="button" value="Copy" id="J_DoCopy">
3 <script src="dist/ZeroClipboard.min.js"></script>

1 (function(){
2     var btn = document.getElementById('J_DoCopy'),
3         text = document.getElementById('J_TextIn'),
4         zc = new ZeroClipboard(btn);
5     zc.on('beforecopy', function(e){
6         zc.setText(text.value);
7     });
8 })();
 

現在不使用ZeroClipboard我們也能實現 簡單易用 非常成功！

1 <input type="text" name="" id="J_TextIn" value="Copy Test.">
2 <input type="button" value="Copy" id="J_DoCopy">

 1 (function(){
 2     var btn = document.getElementById('J_DoCopy'),
 3         text = document.getElementById('J_TextIn');
 4     btn.onclick = function(){
 5         var transfer = document.getElementById('J_CopyTransfer');
 6         if (!transfer) {
 7             transfer = document.createElement('textarea');
 8             transfer.id = 'J_CopyTransfer';
 9             transfer.style.position = 'absolute';
10             transfer.style.left = '-9999px';
11             transfer.style.top = '-9999px';
12             document.body.appendChild(transfer);
13         }
14         transfer.value = text.value;
15         transfer.focus();
16         transfer.select();
17         document.execCommand('Copy', false, null);
18     };
19 })();
 

我再測試過程中，曾試圖將過渡的那個textarea設定為不可見的 visibility:hidden; ，卻發現複製功能失效了，所以這裡需要注意一下...

另外還有一個更好用的clipboard.js 給大家一個地址 自己去學習吧

http://www.webkaka.com/Blog/ARCHIVES/demo/clipboard.js-master/demo/index.html