美文网首页
js复制功能的实现

js复制功能的实现

作者: lvyweb | 来源:发表于2019-09-29 13:13 被阅读0次

1, html页面需要引入 clipboard.min.js
2, 给要复制的内容的dom元素添加属性
例如:

<p class="caseImgP">
    <span class="span-Elide copy-txt text-ellipsis"  id="foo1">新建案件测试1111</span>
    <span class="rightSpan underlineSpan copy" data-clipboard-target="#foo1">复制</span>
</p>

意思是点击“复制”这俩字会复制“新建案件测试1111”这几个字 其中id=“foo1”和data-clipboard-target="#foo1"相对应

3,初始化这个复制事件

var clipboard = new ClipboardJS('#subCaseList li .caseImgRec .caseImg .caseImgDown .copy');
clipboard.on('success', function (e) {
console.log(e);
});
clipboard.on('error', function (e) {
console.log(e);
});

更多API,详见官网http://www.clipboardjs.cn/

相关文章

网友评论

      本文标题:js复制功能的实现

      本文链接:https://www.haomeiwen.com/subject/rkhnuctx.html