兼容多种浏览器”复制到剪贴板”的解决方案

浏览器的兼容问题一直以来都是一个令人头疼的问题,要实现“复制到剪贴板”的功能,由于安全问题,浏览器的限制越来越严,实现的方法也越来越有限,这个简单的功能要想实现兼容不同的浏览器还真不容易,根据网上的一些资料结合我测试的经验,相关解决方案如下:

方案一:利用“window.clipboardData”

代码示例:

if (window.clipboardData) {
window.clipboardData.clearData();
window.clipboardData.setData("Text", txt)
};

问题:这个方案只对IE浏览器适用。

方案二:利用“Components.interfaces.nsIClipboard”

代码示例:

if (window.netscape) {
try {
netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
} catch (e) {
if (flag == 0) {
alert("You are using the Firefox browser, copy the function browser refuse!
\nPlease in the browser address bar enter'about:config' and Enter \n and set'signed.applets.codebase_principal_support' to 'true'");
} else {
alert("你使用的是Firefox 浏览器,复制功能被浏览器拒绝!\n请在浏览器地址栏输入'about:config'
并回车\n然后将'signed.applets.codebase_principal_support'设置为'true'");

}
}
var clip = Components.classes['@mozilla.org/widget/clipboard;1'].createInstance
(Components.interfaces.nsIClipboard);
if (!clip)
return;
var trans = Components.classes['@mozilla.org/widget/transferable;1'].createInstance
(Components.interfaces.nsITransferable);
if (!trans)
return;
trans.addDataFlavor('text/unicode');
var str = new Object();
var len = new Object();
var str = Components.classes["@mozilla.org/supports-string;1"].createInstance
(Components.interfaces.nsISupportsString);
var copytext = txt;
str.data = copytext;
trans.setTransferData("text/unicode", str, copytext.length * 2);
var clipid = Components.interfaces.nsIClipboard;
if (!clip)
return false;
clip.setData(trans, null, clipid.kGlobalClipboard);

}

问题:这个方案只适合Firefox,同时也有安全问题,如果想使用这个方法,必须手动开启Firefox的一个配置:signed.applets.codebase_principal_support。方法是:在地址栏输输入“about:config”,设置“signed.applets.codebase_principal_support”为true,默认该项是false。

把这个方案和方案一结合,可以解决IE和Firefox浏览器的相对兼容。

方案三:利用隐藏的flash

代码示例:

var clipboardswfdata;

var setcopy_gettext = function(){
    clipboardswfdata = document.getElementById('data').value;
    window.document.clipboardswf.SetVariable('str', clipboardswfdata);
}

var floatwin = function(){
    alert('copy success, ' + clipboardswfdata);
}

点此复制到剪贴板

利用一个clipboard.swf作为桥梁,复制内容到剪贴板。原理是:创建一个隐藏的flash文件,通过onmouseover 事件往 flash 中传递数据。

演示地址: http://www.lsproc.com/demo/clipboard/demo.html

这个方法兼容IE、Firefox、Opera、Chrome、 Safari和Flash10,真可谓万能的解决方案。浏览器Flash的安装率非常高,这几乎是一个完美的解决方案。

另外,google code 上有个 zeroclipboard 的项目, 也是利用的flash,如果想要方便的话, 也可以使用。

地址: http://code.google.com/p/zeroclipboard/

原创文章,转载请注明: 转载自闲云博客

本文链接地址: 兼容多种浏览器”复制到剪贴板”的解决方案

发表评论

电子邮件地址不会被公开。 必填项已用*标注