IE本身有提供了原生的支持:clipboardData 和 setData。Firefox 等都没有,因此利用 flash 来做跨浏览器支持。
使用 ZeroClipboard 是目前最好的解决方式(需要在服务器上运行):
Zero Clipboard 利用透明的 Flash 让其漂浮在复制按钮之上,这样其实点击的不是按钮而是 Flash ,这样将需要的内容传入Flash,再通过Flash的复制功能把传入的内容复制到剪贴板。
THML:
<button id="copy-button" data-clipboard-text="Copy Me!" title="Click to copy me.">Copy to Clipboard</button>
<script src="ZeroClipboard.js"></script>
<script src="main.js"></script>
// main.js
var clip = new ZeroClipboard( document.getElementById("copy-button"), {
moviePath: "/path/to/ZeroClipboard.swf"
});
clip.on( 'load', function(client) {
// alert( "movie is loaded" );
});
clip.on( 'complete', function(client, args) {
this.style.display = 'none'; // "this" is the element that was clicked
alert("Copied text to clipboard: " + args.text );
});
clip.on( 'mouseover', function(client) {
// alert("mouse over");
});
clip.on( 'mouseout', function(client) {
// alert("mouse out");
});
clip.on( 'mousedown', function(client) {
// alert("mouse down");
});
clip.on( 'mouseup', function(client) {
// alert("mouse up");
});