想要从浏览器复制字符到剪贴板,网上有很多方法,其中有使用flash的ZeroClipboard,也有window.clipboardData(适用于IE)。
或者利用Textarea的select方法和document.execCommand("Copy")来进行复制,但是这样只能复制Textarea的value属性的内容。想要复制其它内容,可以先将Textarea的value属性设置为想要复制的内容,再重复上述的步骤。
为了不让Textarea影响网页视觉效果,可以设置其CSS的opacity为0,不能设置display:none或visibility:hidden,这样会使上述的操作无效。
这里编写了实现上述功能的一个jQuery插件:
;(function($)
{
var clipboardDummy=$("<textarea id=\"clipboardDummy\" style=\"position: absolute;width:0;height:0;opacity: 0;\"></textarea>");
$(function()
{
$("body").append(clipboardDummy);
});
$.fn.extend(
{
/**
* @name 复制到剪贴板
* @description 将元素value或innerHTML值复制到剪贴板,value优先。
*/
"copyToClipboard":function()
{
if(this.val())
clipboardDummy.val(this.val());
else if(this.html())
clipboardDummy.val(this.html());
clipboardDummy[0].select();
document.execCommand("Copy");
return this;
}
});
})(jQuery);
源码:https://git.oschina.net/skywingjiang/clipboard.git