1.实现点击按钮，复制文本框中的的内容
<script type="text/javascript">function copyurl2(){var url2=document.getelementbyid("biao1");url2.select(); // 选择对象document.execcommand("copy"); // 执行浏览器复制命令alert("已复制好，可贴粘。");}</script><textarea cols="20" rows="10" id="biao1">用户定义的代码区域</textarea><input type="button" onclick="copyurl2()" value="点击复制代码" />
2.复制专题地址和 url 地址，传给 qq/msn 上的好友
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="content-type" content="text/html; charset=gb2312" /><title>js复制代码</title></head><body><p><input type="button" name="anniu1" onclick='copytoclipboard()' value="复制专题地址和url地址，传给qq/msn上的好友"><script language="javascript">function copytoclipboard(){var clipboardcontent="";clipboardcontent+=document.title;clipboardcontent+="";clipboardcontent+=this.location.href;window.clipboarddata.setdata("text",clipboardcontent);alert("复制成功，请粘贴到你的qq/msn上推荐给你的好友");}</script>
3.直接复制 url
<input type="button" name="anniu2" onclick='copyurl()' value="复制url地址"><script language="javascript">function copyurl(){var clipboardcontent=this.location.href;window.clipboarddata.setdata("text",clipboardcontent);alert("复制成功!");}</script>
4.点击文本框时，复制文本框里面的内容
<input onclick="ocopy(this)" value="你好.要copy的内容!"><script language="javascript">function ocopy(obj){obj.select();js=obj.createtextrange();js.execcommand("copy")alert("复制成功!");}</script>
5.复制文本框或者隐藏域中的内容
<script language="javascript">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("复制成功!");}</script>
6.复制 span 标记中的内容
<script type="text/javascript"></script><br /><br /><script type="text/javascript">function copytext(obj) {var rng = document.body.createtextrange();rng.movetoelementtext(obj);rng.scrollintoview();rng.select();rng.execcommand("copy");rng.collapse(false);alert("复制成功!");}</script>
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实现但击自动选中文本
<!doctype html public "-//w3c//dtd html 4.01 transitional//en""http://www.w3.org/tr/html4/loose.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=gb2312"><title>自动选择文本框/编辑框中的文字</title><script type="text/javascript">function myselect_txt(){ if (document.form1.title.focus){ document.form1.title.select();}}function myselect_txtarea(){ if (document.form1.content.focus){ document.form1.content.select();}}</script></head><body style="font-size:12px"><table width="443" height="97" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#f9f9f9"> <form name="form1"> <tr bgcolor="#214994"> <td height="25" colspan="2"><p align="center"><font color="#ffffff">新闻信息修改</font></p></td> </tr> <tr> <td width="80" height="28"><p align="right"><font color="#214994">新闻标题：</font></p></td> <td width="363"><input name="title" type="text" size="50" value="今日新闻头条" onclick="myselect_txt()"></td> </tr> <tr> <td height="20"><p align="right"><font color="#214994">新闻内容：</font></p></td> <td rowspan="2"><textarea name="content" cols="50" rows="6" onclick="myselect_txtarea()">今日,据相关方面报道,...</textarea></td> </tr> <tr> <td height="10"> </td> </tr> <tr> <td height="32" colspan="2"> <p align="center"> <input name="add" type="submit" id="add" value="添加"> <input name="submit" type="reset" value="重置"> </p></td> </tr> </form></table></body></html>
当前最常用的最简洁还是这个，代码少，减少页面加载速度
function copytoclipboard(txt) { if(window.clipboarddata){ window.clipboarddata.cleardata(); window.clipboarddata.setdata("text", txt); alert('复制成功！') }else{ alert('请手动复制！') } }
上面是我整理给大家的，希望今后会对大家有帮助。
相关文章：
在vue中如何修改a标签样式？
使用vue-meta如何管理头部标签
nuxt.js常见的一些问题（详细教程）
react native有关跨域资源出错问题
在nodejs中安装最新版npm（详细教程）
以上就是利用js代码如何实现复制功能的详细内容。