明明插入clipboard.js文件了为什么还是不能使用该功能?

clipboard.png
我想把后台给的一个链接复制下来,前提是这个按钮被触动之后,链接随着按钮被触动就会自动复制到手机的剪贴板上。
js文件和html文件分别在两个文件里,html文件里我已经把下载的clipboard.js引入了,但是在该页的js文件里我要创建一个对象如下图:
clipboard.png

但是控制台说不行
clipboard.png

这是为什么??

还有一个问题是在这里的这个按钮上我用了一个data-clipboard-text的属性,我希望我后台的返回的那个链接能够直接给这属性赋值,然后我点击就可以了,请问这要怎么做,在下图我是点击才绑定这个事件的,但是这样应该是不行的吧,要点击之前就把这个链接给这个button的吧,可是后台这个链接要怎么做才能提前把返回的这个链接给这个button?

回复
阅读 4.6k
2 个回答
  1. 有一种可能就是js文件顺序不对(clipboard.js要放在自己文件前面),还有种可能就是根本就没引入进来(看看network面板内是否有这个文件),或许就是路径拼写错误
  2. 在 button 上让后端加一个 data-clipboard-text 属性,值就是要复制的内容
<button id="copy-url" data-clipboard-text="让后端加一个链接放这里">
   复制
</button>
var clipboard = new Clipboard('#copy-url');

clipboard.on('success', function (e) {
    console.log('复制的内容为:', e.text);
    e.clearSelection();
});

clipboard.js从npm下载下来之后 如果只把里面clipboard.min.js直接拿出来用有问题,这里面没有Clipborad对象,从网上用了一个CDN完全可以解决问题

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏