在网页中有的文本框旁边有个一键复制的按钮,具体是怎么实现的呢,我一般都是使用JavaScript来操作文本框,记住必须是文本框,input标签是不可以的,下面这段代码就是关于调用JavaScript来实现的,有需要的可以根据自己的需求更改,效果图我放在博文最后了,大家可以参考。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 |
<!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=UTF-8"> <title>一键复制功能</title> </head> <body> <script type="text/javascript"> function copyUrl2() { var Url2=document.getElementById("biao"); //alert(obj); Url2.select(); // 选择对象 document.execCommand("Copy"); // 执行浏览器复制命令 alert("复制成功,快去贴粘吧。"); } </script> <div align="center"> <table border=1 bordercolor=#FFFFFF style="border-collapse: collapse"> <TR vAlign=top align=center bgcolor=#FFF> <TH width=90><input style="width: 100px; height: 25px" type="button" onClick="copyUrl2()" value="点击即可复制" /><br> </TH> </TR> <TR vAlign=top align=center bgcolor=#F1F1FD> <TD><textarea cols="10" rows="5" id="biao">这里是要复制的内容,你也可以在文本框里直接输入</textarea> </TD> </TR> </TABLE> </div> </body> </html> |