js 复制到粘贴板 实现 兼容安卓、iOS

2019-01-23  本文已影响0人  果好鲜
使用clipboard.js插件
<span class="copy" id="demo" data-clipboard-text="abcdefg >.<">复制</span>
<script type="text/javascript" src="plugins/clipboard/clipboard.min.js"></script>
<script type="text/javascript">
    var clipboard = new ClipboardJS('#demo');

    clipboard.on('success', function(e) {
      console.info('Action:', e.action);
      console.info('Text:', e.text);
      // console.info('Trigger:', e.trigger);
      alert('复制成功,复制到的内容是:' + e.text);
      e.clearSelection();
    });

    clipboard.on('error', function(e) {
      console.error('Action:', e.action);
      console.error('Trigger:', e.trigger);
      alert('复制失败!')
    });
  </script>
这样在安卓手机上没有问题,但是iOS手机上就没有反应了。

修改一下代码:

<span class="copy" id="demo" data-clipboard-text="abcdefg >.<" onclick="" style="cursor:pointer;">复制</span>
注意:

span加了一个css属性:cursor:pointer;
以及 onclick="",这个空事件,原因是ios默认非点击标签不具有点击效果,所以给这些标签添加相关属性,这样系统可以识别出来!

参考文章:
clipboard.js兼容ios
上一篇下一篇

猜你喜欢

热点阅读