手机端点击复制链接到剪切板(以及PC端)
一直在找如何能点击按钮将一串字符串放到手机的剪切板上,但是可能是因为搜索的关键字不对,一直无果。
向同事请教了一下,给了一个clickboard.js的插件。开始试验的时候,使用手机自带浏览器进行测试,但是提示复制失败,就以为不行,但是其他人尝试的时候,都说是成功的,原来是微信端是可以使用这个复制方法的。
因为一般所做的网页都是用微信端进行访问,所以这样也算是实现了想要的功能。
<a href="javascript:;" style="color: #fff;"data-clipboard-text="@Model.ActivityLink" id="copyLink">复制活动链接</a>
<script src="/content/scripts/clipboard/clipboard.min.js"></script>
<script>
var clipboard = new Clipboard('#copyLink');
clipboard.on('success', function (e) {
alert("复制成功!");
return;
}); clipboard.on('error', function (e) {
var link = $("#copyLink").attr("data-clipboard-text");
alert("复制失败!请手动复制,地址“" + link + "”");
return;
});
</script>
data-clipboard-text即为插件获取需要复制的字符串所处的属性名
至于这个js是GitHub中开源的一个项目https://github.com/zenorocha/clipboard.js (实现纯 JavaScript (无 Flash)的浏览器内容复制到系统剪贴板的功能)
这个插件也是可以使用在PC端的,火狐,google,qq浏览器都是可以使用的。只是手机端的浏览器大概是机制问题?无法使用。
这里还有一个js插件:https://files.cnblogs.com/files/danlis/zeroclipboard.zip 直接把这个上传到了博客园的文件中,据说是PC端的复制,我还没测试过。
手机端点击复制链接到剪切板(以及PC端)的更多相关文章
- 点击复制内容到剪切板(clipboard)
clipboard官方文档:https://clipboardjs.com/ 安装: 1.用npm:npm install clipboard --save 2.下载:https://github.c ...
- Unity3d 复制文字到剪切板及存储图像到相册
游戏中里开发分享功能时用到两个小功能:1.复制一个链接到剪切板供在其他应用粘贴分享使用,2.保存一张二维码图像到相册供发送给其他应用用于分享.但是在unity中无法完成,需要分别开发相应的插件. An ...
- JS禁止右键查看源码,禁止复制,复制内容到剪切板
有时候我们希望自己的网页源码不被查看,这时需要关掉鼠标的右击事件;有时候我们也希望禁止选择页面内容Ctrl+C复制. 1.禁止右键查看源码; <script> //设置右键事件 funct ...
- C#复制数据到剪切板
C#复制数据到剪切板 1. 复制固定的数据到剪切板 Clipboard.SetText("123456"); 于是123456就已经复制到剪切板中了,无论在任何地方粘贴都会出现‘1 ...
- javascript复制内容到剪切板/网页上的复制按钮的实现
javascript复制内容到剪切板/网页上的复制按钮的实现:DEMO如下 <!doctype html> <html> <head> <meta chars ...
- 函数节流及手机端点击延迟200ms解决方法
不论是H5开发还是微信小程序,手机端点击都会有300ms的延迟,在实际项目中,会到此频繁触发,如有接口会频繁的请求接口,除了会引起不必要的多次请求还会导致数据有问题.下面有二种方式来处理这个问题: 1 ...
- 简单实现兼容各大浏览器的js复制内容到剪切板
因为网站文章需要提供几个按钮,单击后实现复制文章内容到剪贴板. 在网上搜索了很多内容,发现都比较乱这里自己整理下,分享给大家 效果图如下: 之前使用的是window.clipboardData.set ...
- js复制内容到剪切板,兼容pc和手机端,支持Safari浏览器
最近,一些项目中用到监听用户复制.剪切的操作. 案例1.在PC端,当用户获得一个京东卡的使用券,当用户使用ctrl + C复制得到的使用券时,将使用券的代号复制到粘贴板,以便于用户ctrl+v进行 ...
- angular中复制文字到剪切板
function copyToClipboard(oElement, value) { var aux = document.createElement("input"); if ...
随机推荐
- python 读写配置文件
使用python读写配置文件,写个demo测试一下. #!/usr/bin/env python import os import ConfigParser # 如果文件不存在,就穿件文件. if o ...
- MySql 存储过程总结
MySql 存储过程 -- ---------------------------- -- Procedure structure for `proc_adder` -- -------------- ...
- (转)live555学习笔记7-RTP打包与发送
七 RTP打包与发送 rtp传送开始于函数:MediaSink::startPlaying().想想也有道理,应是sink跟source要数据,所以从sink上调用startplaying(嘿嘿,相当 ...
- jQuery table td可编辑
参考链接: http://www.freejs.net/ http://www.freejs.net/article_biaodan_34.html http://www.freejs.net/sea ...
- wapp HTTP Error 404. The requested resource is not found.
原因: 本地80端口被占用,需要修改WAMP的默认端口 修改设置: 找到 bin/apache/apache***/conf/httpd.conf文件 将文件中的80修改为8088 修改这两个地方端口 ...
- c++ String去除头尾空格
1.使用string的find_first_not_of,和find_last_not_of方法 #include <iostream> #include <string> s ...
- Spring AOP的日志记录
现在的项目是Spring+MyBatis,前段时间项目经理让我干了一个活,就是给所有的controller里的所有方法加上日志记录的代码,其实没有多少,也就300来个方法,也没有抱怨什么,一边打着瞌睡 ...
- 详解MathType中如何更改公式颜色
在MathType数学公式编辑器中可以通过更改公式颜色,起到美化.标注公式的效果.本教程将详解MathType中如何更改公式颜色. 点击菜单栏中的样式->格式->颜色,用户就可以根据自己的 ...
- (IRCNN)Learning Deep CNN Denoiser Prior for Image Restoration-Kai Zhang
学习深度CNN去噪先验用于图像恢复(Learning Deep CNN Denoiser Prior for Image Restoration)-Kai Zhang 代码:https://githu ...
- 如何破解银行O2O模式创新
文/赵志宏 摩 根大通的买房APP,使客户可根据自己的位置选择合适的贷款经理:华道数据提供的卡惠APP,使客户可随时查询自己周围信用卡刷卡打折的商户信息:民生银 行的微信预约叫号功能,使客户根据可自己 ...