美文网首页前端
[FE]Js中复制到剪切板

[FE]Js中复制到剪切板

作者: _小老虎_ | 来源:发表于2018-07-31 14:01 被阅读10次

    https://cdn.bootcss.com/clipboard.js/2.0.0/clipboard.js

    准备工作 js修复:

    如果用jquery,那么则需要在clipBoard的定义下面加上:

    // mydefine
    $.Clipboard = Clipboard;

    在 var Clipboard = function (_Emitter) 的定义后面加上的,

    不然会报错

    会报错Clipboard is not defined的问题。

    使用:

    <!DOCTYPE html> <head> 
     <meta charset="UTF-8"> 
     <title>clipboard示例</title> 
     <script src="clipboard.min.js"> </script> 
     </head> 
    
     <body> <!--data-clipboard-text属性的值将会被复制--> <div id="btn" class="js-copy" data-clipboard-text="我是被复制的内容啊"> <span>点击复制</span> </div> 
    
     <script> 
    var btn = document.getElementById('btn'); var clipboard = new Clipboard(btn);//实例化
    //复制成功执行的回调,可选
    clipboard.on('success', function(e) { console.log(e); });
    //复制失败执行的回调,可选
    clipboard.on('error', function(e) { console.log(e); });
     </script> 
    
     </body> 
     </html>
    

    相关文章

      网友评论

        本文标题:[FE]Js中复制到剪切板

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