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

js实现复制内容到剪贴板

时间:2019-12-07 21:43:33      阅读:128      评论:0      收藏:0      [点我收藏+]

标签:let   pre   行选中   -o   不可   document   oar   func   target   

一、 原生js实现,电脑可以用,手机不可以用

  1. 必须是 input元素 才可以使用

    <input id="code" type="text" value="www">

    <span class="copy-btn" v-on:click="copy">复制</span>

    //获取input并执行选中

    document.getElementById(‘code‘).select();

    //执行documen的copy事件
    document.execCommand(‘copy‘);

二、clipboard.js 实现,电脑、手机都可以用  https://github.com/zenorocha/clipboard.js

  1.  input、div 任何元素都可以使用

    <span id="code">123456</span>

    <span class="copy-btn" data-clipboard-target="#code" v-on:click="copy">复制</span>

    let clipboard = new ClipboardJS(‘.copy-btn‘);
    clipboard.on(‘success‘, function(e) {
      //复制成功
      console.log("复制成功");
      //取消选中
      e.clearSelection();
    });







js实现复制内容到剪贴板

标签:let   pre   行选中   -o   不可   document   oar   func   target   

原文地址:https://www.cnblogs.com/zhangruiqi/p/12003065.html

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