兼容Android和iOS复制到剪切板

2017-10-12  本文已影响0人  zzj_alpaca
if (navigator.userAgent.match(/(iPhone|iPod|iPad);?/i)) { //区分iPhone设备  
          window.getSelection().removeAllRanges(); //这段代码必须放在前面否则无效  
          var Url2 = document.getElementById("biaoios"); //要复制文字的节点  
          var range = document.createRange();
          // 选中需要复制的节点  
          range.selectNode(Url2);
          // 执行选中元素  
          window.getSelection().addRange(range);
          // 执行 copy 操作  
          var successful = document.execCommand('copy');

          // 移除选中的元素  
          window.getSelection().removeAllRanges();
        } else {
          var save = function (e) {
            e.clipboardData.setData('text/plain', _this.yaoqingma);
            e.preventDefault();
          }
          document.addEventListener('copy', save);
          document.execCommand('copy');
          document.removeEventListener('copy', save);
        }
//复制 按钮显示消失
        $('.copy_success').css('display', 'block');
        setTimeout(function () {
          $('.copy_success').css('display', 'none');
        }, 800);

复制按钮效果

.copy_success {
    width: 280px;
    height: 80px;
    background: #000;
    opacity: 0.5;
    font-size: 24px;
    text-align: center;
    color: #fff;
    line-height: 80px;
    border-radius: 20px;
    position: absolute;
    left: 50%;
    margin-left: -140px;
    bottom: 180px;
    display: none;
  }

上一篇下一篇

猜你喜欢

热点阅读