JS代码实现复制功能

本人没什么基础看了好久百度,不知道为什么在百度上问一个js实现copy功能会多出那么多代码出来,感觉废话一堆效果还没能达到需要复制 的效果。

然而在我看来,js复制代码 无非就那么几句罢了。原生copy代码:document.execCommand("Copy");  就可以达到复制的效果了,但我习惯用以下的方法:

首先,必须要调用第三方【clipboard.min.js】包,有它才能js代码才能实现复制功能,js包网上都可以下。这个如同jQuery一样调用: 即可,这是第一句代码;

第二句代码 对对象进行操作的方式方法有两种可以选择:

(1)data-clipboard-action="copy";    复制

(2)data-clipboard-action="cut";     剪切

第三句代码 copy或cut 的对象是谁:

data-clipboard-target=".abc"      //这个对象可以是 #id,也可以类选择器  .class ,也可以是元素等等

第四句代码 实例化 Clipboard 对象:

var clipboard = new Clipboard(".abc");  到这里代码就已经实现了复制的功能了

-----------------------------------------------------------------------------------------------------------------------------------------

看看 案例代码:

(1)纯文本copy:textarea

copyUrl2()" value="点击复制Copy" /> 

 

-------------------------------------------------------------------------------------------------

(2)非纯文本内容的某个标签:span例举

btn" class="abc" data-clipboard-action="copy" data-clipboard-target=".abc">这里可以点击复制

点击内容直接执行js代码:

 ---------------------------------------------------------------------

(3).我比较喜欢使用下面这种传参的方式,

target" style="font-size: 15pt;color: red;" >85687

 

 

你可能感兴趣的:(JS代码实现复制功能)