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

  • 相关阅读:
    AI常用环境安装
    ubantu打开摄像头失败
    python 从ubantu环境迁移到windows环境
    mystar01 nodejs MVC 公共CSS,JS设置
    Golang数据类型之结构体-上篇
    Golang基准测试
    浅谈Prometheus的数据存储
    Golang单元测试
    Jenkins连接k8s的多种姿势
    Golang数据类型之指针
  • 原文地址:https://www.cnblogs.com/danlis/p/7649279.html
Copyright © 2011-2022 走看看