首页 > 编程知识 正文

javascript操作剪贴板的简单介绍

时间:2023-12-09 23:04:58 阅读:313633 作者:CJDS

本文目录一览:

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

谷歌浏览器 怎么用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内的内容放到剪切板?

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

function CopyUrl()

{

var htm = document.getElementById("yourdiv").innerHTML;

window.clipboardData.setData('text', htm);

}

yourdiv 就是你的div的ID

JavaScript如何点击实现复制文字到剪切板

可以使用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查询。

js将内容放到剪贴板怎么写呢?

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

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

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。