如果只是兼容IE可用如下方法實現:
- function copyToClipboard() {
- var format = "text";
- var value;
- var isIE = false;
- if(!+[1,]) {
- isIE = true;
- }
- if(isIE) {
- value = document.getElementById("exCode").outerText;
- if(window.clipboardData) {
- window.clipboardData.setData(format, value);
- }
- alert("已拷貝到剪切板!");
- }
- }
但是非IE等瀏覽器及Firefox、Chrome、Opera等都不支持window.clipboardData對象,且不允許前端頁面直接複製元素信息至剪貼板,所以要實現兼容所有瀏覽器的實現複製到剪貼板的功能需用到ZeroClipboard.js、ZeroClipboard.swf、jquery-1.7.1.js等核心JS Framework:
具體實現如下:
- $(function() {
- ZeroClipboardInit();
- });
- function ZeroClipboardInit() {
- var clip = new ZeroClipboard.Client();
- clip.addEventListener('complete', function(client, text) {
- alert("已拷貝到剪切板!");
- //多個拷貝按鈕需要綁定拷貝時需移除上一個clip
- clip.destroy();
- });
- clip.setText('what you want to copy to Clipboard');
- //綁定DOM中的元素ID,一般爲Input
- clip.glue('BtnExport');
- }
注:ZeroClipboard包下載地址如下:http://code.google.com/p/zeroclipboard/