利用js代码如何实现复制功能

这篇文章主要介绍了js实现复制功能(多种方法集合),需要的朋友可以参考下

1.实现点击按钮，复制文本框中的的内容

function copyUrl2(){var Url2=document.getElementById("biao1");Url2.select(); // 选择对象document.execCommand("Copy"); // 执行浏览器复制命令alert("已复制好，可贴粘。");}<span class="com">用户定义的代码区域</span>

登录后复制

2.复制专题地址和 url 地址，传给 QQ/MSN 上的好友

nbsp;html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
function copyToClipBoard(){var clipBoardContent="";clipBoardContent+=document.title;clipBoardContent+="";clipBoardContent+=this.location.href;window.clipboardData.setData("Text",clipBoardContent);alert("复制成功，请粘贴到你的QQ/MSN上推荐给你的好友");}

登录后复制

3.直接复制 url

function copyUrl(){var clipBoardContent=this.location.href;window.clipboardData.setData("Text",clipBoardContent);alert("复制成功!");}

登录后复制

4.点击文本框时，复制文本框里面的内容

function oCopy(obj){obj.select();js=obj.createTextRange();js.execCommand("Copy")alert("复制成功!");}

登录后复制

5.复制文本框或者隐藏域中的内容

function CopyUrl(target){target.value=myimg.value;target.select(); js=myimg.createTextRange(); js.execCommand("Copy");alert("复制成功!");}function AddImg(target){target.value="[IMG]"+myimg.value+"[/ img]";target.select();js=target.createTextRange(); js.execCommand("Copy");alert("复制成功!");}

登录后复制

6.复制 span 标记中的内容

function copyText(obj) {var rng = document.body.createTextRange();rng.moveToElementText(obj);rng.scrollIntoView();rng.select();rng.execCommand("Copy");rng.collapse(false);alert("复制成功!");}

登录后复制

7.浏览器兼容 copyToClipboard(“拷贝内容”)

function copyToClipboard(txt) {      if (window.clipboardData) {        window.clipboardData.clearData();        clipboardData.setData("Text", txt);        alert("复制成功！");      } else if (navigator.userAgent.indexOf("Opera") != -1) {        window.location = txt;      } 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("复制成功！");      }    }

登录后复制

js实现但击自动选中文本

nbsp;HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">function Myselect_txt(){ if (document.form1.title.focus){  document.form1.title.select();}}function Myselect_txtarea(){ if (document.form1.content.focus){  document.form1.content.select();}}

登录后复制 

当前最常用的最简洁还是这个，代码少，减少页面加载速度

function copyToClipboard(txt) {  if(window.clipboardData){  window.clipboardData.clearData();  window.clipboardData.setData("Text", txt);alert('复制成功！')}else{alert('请手动复制！')}  }

登录后复制

上面是我整理给大家的，希望今后会对大家有帮助。

相关文章：

在vue中如何修改a标签样式？

在vue中如何修改a标签样式？

在vue中如何修改a标签样式？

在vue中如何修改a标签样式？

在vue中如何修改a标签样式？

以上就是利用js代码如何实现复制功能的详细内容，更多请关注【创想鸟】其它相关文章！