码迷,mamicode.com
首页 > Web开发 > 详细

js复制内容到粘贴板

时间:2020-03-16 21:48:11      阅读:77      评论:0      收藏:0      [点我收藏+]

标签:roc   new   html   img   mic   err   --   alt   cloud   

⒈引入第三方js:   clipboard

<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.4/clipboard.min.js"></script>
    <!-- 方式一  -->
    <input id="inpu" value="https://github.com/zenorocha/clipboard.js.git">
    <button class="inpu"" data-clipboard-target="#inpu">input复制</button>
   <!-- 方式二 -->
    <textarea id="cut">cuttext</textarea>
    <button class="cut" data-clipboard-action="cut" data-clipboard-target="#cut">剪切</button>
    <!-- 方式三 -->
    <button class="btn" data-clipboard-text="copytext">btn复制</button>
    <br><br><textarea id="cut" placeholder="试试黏贴" style="margin: 0px; width: 521px; height: 50px;"></textarea>
    <script>
        var clipboard1 = new ClipboardJS(‘.inpu‘);
        var clipboard2 = new ClipboardJS(‘.cut‘);
        var clipboard3 = new ClipboardJS(‘.btn‘);

        // clipboard.on(‘success‘, function(e) {
        //     console.info(‘Action:‘, e.action);
        //     console.info(‘Text:‘, e.text);
        //     console.info(‘Trigger:‘, e.trigger);
        //     e.clearSelection();
        // });

        // clipboard.on(‘error‘, function(e) {
        //     console.error(‘Action:‘, e.action);
        //     console.error(‘Trigger:‘, e.trigger);
        // });
        // clipboard.destroy();//销毁
    </script>

 ⒉效果:   

  技术图片

js复制内容到粘贴板

标签:roc   new   html   img   mic   err   --   alt   cloud   

原文地址:https://www.cnblogs.com/bkyyay/p/12506903.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!