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("您的浏览器似乎不支持一键复制功能哦")

});

安装和使用

官网地址：https://clipboardjs.com/

Github地址：https://github.com/zenorocha/clipboard.js/

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

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

分享到：

打赏

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

支付宝扫一扫打赏

微信扫一扫打赏

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

ios下js复制到粘贴板_h5实现一键复制到粘贴板兼容ios
实现原理采用document.execCommand('copy') 来实现复制到粘贴板功能复制必须是选中input框的文字内容,然后执行document.execCommand('copy') ...
html 一键复制 ios,h5实现一键复制到粘贴板-兼容ios
实现原理采用document.execCommand('copy')来实现复制到粘贴板功能复制必须是选中input框的文字内容,然后执行document.execCommand('copy')命令 ...
h5 实现一键复制到粘贴板兼容iOS
效果展示先贴上测试连接 http://cdn.foundao.com/zhaosheng/copytext 实现原理采用 document.execCommand('copy') 来实现复制到粘贴 ...
h5实现一键复制到粘贴板兼容iOS
copyText = (text) => {// 数字没有 .length 不能执行selectText 需要转化成字符串const textString = text.toString();l ...
浏览器复制粘贴以及手机端webview复制粘贴
一.浏览器赋值粘贴 1.document.execCommand 这部分参考文档: https://developer.mozilla.org/zh-CN/docs/Web/API/Document/ ...
html弹窗后自动关闭页面,网页一键复制弹出提示窗口后几秒后自动关闭提示js代码...
L 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> ...
通过纯js代码实现将指定内容复制到粘贴板(兼容各主流浏览器)
通过纯js代码实现将指定内容复制到粘贴板(兼容各主流浏览器) 1.业务需求: vue项目需要通过点击button按钮将指定内容复制到粘贴板中,且不引入第三方组件. 2.解决方案: js写法如下(这里是 ...
手机端适应_手机网站开发制作和电脑pc端有哪些区别
现在移动互联网的发展,现在很多企业做网站开发不仅是电脑端的网站,还包括了移动端网站的开发,移动端网站开发和pc端是有一定的区别,比如移动端的页面更小,移动端的打开和加载速度都远低于电脑端访问网站,其实 ...
YOLO-v4目标检测、换脸、视频上色全部实时手机端实现，美国东北大学等提出全自动实时移动端AI框架...
机器之心发布作者:马晓龙转载自公众号:机器之心如何助力深度神经网络在移动端「看得」更清,「跑得」更快?来自美国东北大学等机构的研究者提出一种新型全自动模式化稀疏度感知训练框架. 基于模式化稀疏度 ...

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

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

最新文章

热门文章