码迷,mamicode.com
首页 > 移动开发 > 详细

利用Clipboard.js在手机端实现一次复制,,任意地方粘贴

时间:2017-10-10 20:31:19      阅读:268      评论:0      收藏:0      [点我收藏+]

标签:通过   文字   轻量   mobile   --   blog   方法   logs   代码提示   

Clipboard.js为开发者提供了一个集成了实用的API的多功能轻量级JavaScript库,不依赖Flash。

  1. <script src="lib/clipboard.js-master/dist/clipboard.min.js"></script>

    先引入js包。

  2. html
        <!-- Target -->
        <input id="foo"  value="http://www.968309.com/mobile.php">
    
        <!-- Trigger -->
        <button class="btn" data-clipboard-target="#foo">复制</button>

     

  3. js
    //init
        var clipboard = new Clipboard(‘.btn‘);
        //优雅降级:safari 版本号>=10,提示复制成功;否则提示需在文字选中后,手动选择“拷贝”进行复制
        clipboard.on(‘success‘, function(e) {
            alert(‘复制成功!‘)
            e.clearSelection();
        });
        clipboard.on(‘error‘, function(e) {
            alert(‘请选择“拷贝”进行复制!‘)
        });

     

  • 注意点:
  1. 红色标注部分只支持input和textarea。其他都不支持!
  2. Safari版本是10以上的,可以直接成功复制;如果是版本小于10,可以通过如下代码提示用户手动复制:

利用Clipboard.js在手机端实现一次复制,,任意地方粘贴

标签:通过   文字   轻量   mobile   --   blog   方法   logs   代码提示   

原文地址:http://www.cnblogs.com/xiaolei1004/p/7647302.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!