失眠网,内容丰富有趣,生活中的好帮手!
失眠网 > html手机端一键复制 一键粘贴复制功能-兼容IE9+及其移动端-clipboard.js

html手机端一键复制 一键粘贴复制功能-兼容IE9+及其移动端-clipboard.js

时间:2019-06-26 16:55:39

相关推荐

html手机端一键复制 一键粘贴复制功能-兼容IE9+及其移动端-clipboard.js

使用系统提供的剪贴板是一项基本的IT技能。作为一个开发者,相信你已经知道使用 Ctrl/Cmd+A, Ctrl/Cmd+C 以及 Ctrl/Cmd+V 组合键就能快捷地进行选中、复制、粘贴。但对于普通用户来说就没那么容易了。即使用户知道剪贴板的存在,视力再好、反应再快的用户也很难选中他们想要的文字。接下来,如果用户没有掌握快捷键,或者没发现浏览器隐藏的“编辑”菜单,又或者没用过右键菜单,再或者不知道在触摸屏上需要进行长按,后续的复制过程也很难简单完成。

通常在传统做法中,我们会发现这么个小小功能是很难做好兼容的,然而有了Github,这一切问题似乎都有人在帮你完成

复制

//只需要把需要复制到的内容放在对象的data-clipboard-text属性上即可,

//当然,你也可以通过动态的改变这个内容哦

复制无所不能

var clipboard = new ClipboardJS('.btn');

clipboard.on('success', function(e) {

e.clearSelection();

});

clipboard.on('error', function(e) {

alert("您的浏览器似乎不支持一键复制功能哦")

});

安装和使用

官网地址:/

Github地址:/zenorocha/clipboard.js/

值得注意的是,有些同学去官网下载的clipboard.js使用后发现报错,是因为官网好多都是用的脚手架形式,将文件给细分化了,你所看到的的不是完整的clipboard.js文件,你应该找到的是dist最终打包后的文件,而不是在scr文件夹找,如下图,当然,如果你觉得是在麻烦,你也可以直接在下面的在线一览进入我的demo页面,然后进行ctrl+s进行保存下来即可

「梦想一旦被付诸行动,就会变得神圣,如果觉得我的文章对您有用,请帮助本站成长」

分享到:

打赏

谢谢你请我吃鸡腿*^_^*

支付宝扫一扫打赏

微信扫一扫打赏

如果觉得《html手机端一键复制 一键粘贴复制功能-兼容IE9+及其移动端-clipboard.js》对你有帮助,请点赞、收藏,并留下你的观点哦!

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。