js复制文本到粘贴板（Clipboard.writeText()）-蒲公英云

js复制文本到粘贴板（Clipboard.writeText()）

前言

js如何复制文本到粘贴板呢，网上所说的各种复制。。在Chrome或者说在我这个项目都没用。

windows.copy
document.execCommand(“copy”);
clipboard.js
Clipboard.writeText() ，可行！

网上的代码

通过 document.execCommand('copy') 来操作。

//创建选中范围
    var range = document.createRange();
    range.selectNode(copyDom);
    //移除剪切板中内容
    window.getSelection().removeAllRanges();
    //添加新的内容到剪切板
    window.getSelection().addRange(range);
    //复制
    var successful = document.execCommand('copy');

通过 window.clipboardData.setData('Text',textVal) 这个对象来操作的。可是都不work。

/** * 复制代码 */
$('#btnCopy').bind('click', function (e) { 
    if (!$.isEmptyObject(codeData)) { 
        //support IE
        var clipboardData = window.clipboardData;
        //support Chrome/Firefox
        if (!clipboardData) { 
            clipboardData = e.originalEvent.clipboardData;
        }
        if (!clipboardData) { 
            console.log(clipboardData);
            console.log(clipboardData.getData('text'));
            clipboardData.setData('Text', codeData[id]);
        }
        if(window != undefined){ 
           window.copy($("#genCodeArea").val());
        }
    }
});

clipboard.js

拷贝文字不应当是一件困难的事. 不需要过多繁杂的配置或者下载很多脚本文件. 最重要的，它不应该依赖flash或者其他框架，应该保持简洁，clipboard.js

通过cdn引入
使用功能
查看效果
这个功能正常是可以的，但是可能我用了CodeMirror或者其他js导致冲突。

Clipboard.writeText()

以下场景是来自CodeGenerator的复制功能：

$('#btnCopy').on('click', function(){ 
     if(!$.isEmptyObject(genCodeArea.getValue())&&!$.isEmptyObject(navigator)&&!$.isEmptyObject(navigator.clipboard)){ 
         navigator.clipboard.writeText(genCodeArea.getValue());
         layer.msg("复制成功");
     }
 });