浏览器Js复制，兼容iOS、Android、微信、所有浏览器

浏览器Js复制，兼容iOS、Android、微信、所有浏览器

• 代码是阅读强大的浏览器复制插件 clipboard.js 提取出来的精华部分
• 目前在 微信浏览器 谷歌浏览器 iOS浏览器 Vivo浏览器 Uc浏览器 进行测试过

关于复制 移动端 需要注意的点

• 微信浏览器对于 执行浏览器 Copy 命令做了一定的限制
• 只有在 <Document>.onClick() 的事件中才能进行复制
• 并且是用户主动 点击浏览器 产生的 Click事件
• Js 触发的 Click 事件 不能进行复制
• 博主测试了好多 Event事件 都是返回复制失败
• 所以结论：微信移动端，暂时无法实现进入网页自动复制
• 推荐测试：应当进入微信网页后，跳转到手机原生浏览器，再进行自动复制，没试过是否能自动跳。
• 推荐改动：尽量通过引导的方式，让用户对浏览器进行 一次点击事件 实现复制的操作，例如：立即购买 按钮点击
• 推荐研究：使用各种奇葩姿势验证一波，哈哈哈，找到了，求大佬指点一波！！！

当然，如果你不是移动端，或者不是该死的微信

• 请尽情使用各种 Event 事件 吧，基本都支持。

下面话不多说，直接放秃顶毒（代码）

// 检测是否iOS端
function iosAgent() {
    return navigator.userAgent.match(/(iPhone|iPod|iPad);?/i);
}

// 复制文本函数，微信端，需要在用户触发 Click 事件里面才能执行成功
function copy(message) {

    if(iosAgent()) {
        console.log("input 复制方式 " + message);
        let inputObj = document.createElement("input");
        inputObj.value = message;
        document.body.appendChild(inputObj);
        inputObj.select();
        inputObj.setSelectionRange(0, inputObj.value.length);
        _execCommand('Copy');
        document.body.removeChild(inputObj);
    } else {
        console.log("document 复制方式 " + message);
        let domObj = document.createElement("span");
        domObj.innerHTML = message;
        document.body.appendChild(domObj);
        let selection = window.getSelection();
        let range = document.createRange();
        range.selectNodeContents(domObj);
        selection.removeAllRanges();
        selection.addRange(range);
        _execCommand('Copy');
        document.body.removeChild(domObj);
    }
}

// 执行浏览器命令 Copy 顺便输出一下日志，如果在移动端 推荐写个方法展示日志 或者用 alert(msg) 也行。
function _execCommand(action) {
    let is = document.execCommand(action);
    if(is) {
        console.log("复制成功")
    } else {
        console.log("复制失败")
    }
}

下面那个没什么用，就是方便调试的一个 DIV 小区域，喜欢的可以拿去用

<style>
#logContainer {
	position: fixed;top: 1rem;width: 80%;left: 10%;height: 3rem;line-height: 3rem;text-align: center;background: #000;font-size: 1rem;color: #fff;
}
</style>
<div id="logContainer">调试区域</div>
<script>
function h6log(str) {
    let logObj = document.getElementById('logContainer');
    logObj.innerHTML = "";
    logObj.innerHTML = str + "_" + (Math.random() * 100);
}
</script>