最近做的项目需要使用按钮复制功能,最后确定使用clipboard.js插件。原因:小巧,使用简单,不需要flash,纯js支持。
首先去官网(https://clipboardjs.com)下载clipboard.js的插件,然后引入到自己的项目里;
页面设置按钮,从服务器获取拼装好的url,然后返回;
3. 获取链接后,如果返回成功,会调用弹窗,我这里用的是art-dialog插件;
4. 弹窗页面和代码如下;
5. 点击“复制至剪贴板”会,调用copy_text方法,该方法需要当前点击按钮的id或者class,因为这个按钮是插件后期生成的,所以在浏览器里查看得到class是ui-dialog-autofocus;
6. 从官网下载的demo可以看到有很多的使用场景,我选的是function-text这个demo;
7. 结合项目的代码如下图;
8. 下图是复制后打印的log,实际复制的结果是text的值;
以上是浏览器内容复制的教程,是不是很简单!如果喜欢的话,请点击关注哦!
本文暂时没有评论,来添加一个吧(●'◡'●)