手机端点击复制链接到剪切板(以及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端的复制,我还没测试过。

posted @ 2017-10-11 10:23  Danlis  阅读(4296)  评论(0编辑  收藏  举报