移动端实现复制到剪贴板

    实现复制到剪贴板,用js来实现这个功能,开始的时候只搜索到一个用jquery插件zclip实现的方法,但是这个方法要用的flash,移动端浏览器基本都不支持flash,所以要在移动端实现用这个方法就不灵了。

    最后找到了一个可以实现的方法还比较简单,代码如下:

function copy($ele) {
  var save = function(e) {
    e.clipboardData.setData('text/plain', $ele.text());
    e.preventDefault();
  },
  range;
  if (navigator.userAgent.match(/(iPhone|iPod|iPad);?/i)) { //ios设备
    window.getSelection().removeAllRanges();
    range = document.createRange();
    range.selectNode($ele.get(0));
    window.getSelection().addRange(range);
    document.execCommand('copy');
    window.getSelection().removeAllRanges();
  } else { // 安卓设备
    document.addEventListener('copy', save);
    document.execCommand('copy');
    document.removeEventListener('copy', save);
  }
  // 复制成功后的弹层
  $('.W_copy').show();
  setTimeout(function() {
    $('.W_copy').hide();
  }, 2000);
}

$('.explan').on('click', 'a.btn', function() {
  copy($(this).prev('span'));
});

 

posted @ 2016-09-27 17:04  周截棍的双杰伦  阅读(1956)  评论(0编辑  收藏  举报