1. 程式人生 > >用js實現複製內容到作業系統貼上板(相容IE、谷歌、火狐等瀏覽器)

用js實現複製內容到作業系統貼上板(相容IE、谷歌、火狐等瀏覽器)

一、如果只考慮IE瀏覽器,可以直接用原聲js實現

if(window.clipboardData){
    //清空作業系統貼上板
    window.clipboardData.clearData();
    //將需要複製的內容複製到作業系統貼上板    
    window.clipboardData.setData("Text", "要複製的內容");
}

 

二、如果是其他瀏覽器,上面的辦法行不通,其他瀏覽器出於安全的考慮禁止js訪問作業系統貼上板。

這裡需要用到外掛,網上流行的外掛有兩種,一種是ZeroClipboard.js,一種是clipboard.js。

外掛下載地址:https://zenorocha.github.io

1.用ZeroClipboard.js外掛需要用到以下三個檔案:

ZeroClipboard.js

ZeroClipboard.min.js

ZeroClipboard.swf

這個外掛需要瀏覽器的flash控制元件支援,複製時先把內容複製到flash裡面,再利用flash將內容複製到

作業系統。flash控制元件又被淘汰的可能,有些瀏覽器上相容得也不太好,所以這個外掛不太好用。

2.用clipboard.js外掛需要用到以下一個檔案:

clipboard.min.js

執行復制功能的html標籤上需要加上一個屬性和一個樣式,屬性data-clipboard-text的值表示要複製的內容,

樣式js-copy表示該標籤被繫結上點選複製的功能,在點選該標籤時觸發複製功能。

該外掛相容IE、谷歌、火狐等瀏覽器。

js示例程式碼如下:

$("span").each(function(index,element){if(element.innerHTML=="複製")new Clipboard($(element).parent().attr("data-clipboard-text",Ext.fly(html).dom.innerText).addClass("js-copy")[0]);});