javascript操作剪贴板的简单介绍

• 1、谷歌浏览器 怎么用js复制东西到剪贴板
• 2、js 如何实现将div内的内容放到剪切板？
• 3、JavaScript如何点击实现复制文字到剪切板
• 4、js将内容放到剪贴板怎么写呢？

代码如下：

JS复制内容到剪贴板: 兼容IE、Firefox、Chrome、Safari所有浏览器

function copyToClipboard(txt) {

if(window.clipboardData)

{

window.clipboardData.clearData();

window.clipboardData.setData(“Text”,txt);

alert(“网址复制成功!快用Ctrl+V粘贴到QQ，MSN中发送给好友吧！”)

}

else if(navigator.userAgent.indexOf(“Opera”) != -1)

{

window.location = txt;

alert(“网址复制成功!快用Ctrl+V粘贴到QQ，MSN中发送给好友吧！”)

}

else if (window.netscape)

{

try {

netscape.security.PrivilegeManager.enablePrivilege(“UniversalXPConnect”);

}

catch (e)

{

alert(“被浏览器拒绝！\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);

alert(“网址复制成功!快用Ctrl+V粘贴到QQ，MSN中发送给好友吧！”)

}

}

copyToClipboard(‘ABCD’)

这些代码都是一样的，不存在原创与复制

定义如下JS函数，然后DIV触发onclick 事件就OK。

function CopyUrl()

{

var htm = document.getElementById(“yourdiv”).innerHTML;

window.clipboardData.setData(‘text’, htm);

}

yourdiv 就是你的div的ID

可以使用clipboard插件解决这个问题。

github里直接搜索clipboard就可以找到了。

该插件并不依赖jquery。直接引入即可使用。

使用方法：

input id=”foo” value=”被复制的内容”

button class=”btn” data-clipboard-target=”#foo”点击复制/button

new Clipboard(‘.btn’);

这里的.btn是元素的class属性，可以使用任意id或者class以及元素节点名称来实例化插件。

默认会为元素绑定click事件，点击的时候会触发。

data-clipboard-target参数指定被复制内容的元素。

如上例，点击按钮后会将input的值“被复制的内容”几个字复制到剪切板中。

更多使用方法可以自行github查询。

input type=”text” id=”copyText” value=”” style=”color:#fff; background:#fff; border-color:#fff;border: 0; position:absolute; top:-50px; left:0;” /

script type=”text/jscript”

//复制文本

function copyText(str)

{

if(str.length 0)

{

$(“#copyText”).val(str);

//复制文本

var input = document.getElementById(“copyText”);

input.value = str; // 修改文本框的内容

input.select(); // 选中文本

document.execCommand(“copy”); // 执行浏览器复制命令

//layer提示框

layer.closeAll(‘msg’,{time:10000});

layer.msg(‘span style=”color:red;”已复制：/span/br’+str);

}

}

/script

a href=”jscript:copyText(‘要复制的内容’)”要复制的内容/a

这是代码，这里的文本框不能设置隐藏，否则复制失效，所以我设置的样式让它在浏览器之外的地方，无法被看到