浏览器兼容的copy复制功能(续)

Posted 2021-04-30 前端开发自留地

一文提到ios不支持，在这里做一下更正，是少了下面这行选中特定范围的内容代码：

ele.setSelectionRange(0, ele.value.length);

javascript代码：

var copyToClipboard = function () {
        var win = window,
              doc = document,
              ele = doc.getElementById('copy-txt'),
             txt = ele.value;
        if(win.clipboardData){//IE浏览器
            win.clipboardData.clearData();
            win.clipboardData.setData("Text", txt);
            alert("复制成功！");
            return;
        }
        if(ele.select && doc.execCommand){
           ele.select();//首先要选中要复制的内容
            ele.setSelectionRange(0, ele.value.length);
            //doc.execCommand('Copy')返回值如果是 false 则表示操作不被支持或未被启用
            if( doc.execCommand('Copy') ){
                alert("复制成功！");
            }else{
                alert("复制操作不被支持，请双击内容复制！");
            }
        }
    },
    element = document.getElementById('copy-btn');

if(element.addEventListener){
  element.addEventListener('click',copyToClipboard,false);
}else{
  element.attachEvent('onclick',copyToClipboard);
}

以上代码在ios下也可以使用拷贝功能了。

注：UC浏览器不支持，调用系统指令document.execCommand("Copy")是从chrome42版本开始支持, 而UC浏览器是基于chrome40版本。