移动端复制内容到剪切版

毕业一年...又干起了刚入职的工作......
需求：用户在移动端点击目标的时候，将其内容复制到剪贴版。

初版实现方案：使用execCommand 与 Clipboard API实现。

        //创建输入框
        var input = document.createElement("input");
        //对输入框进行赋值
        input.value = document.getElementById('referralCode').innerText;

        //添加到body中。
        document.body.appendChild(input);
        input.select();
        var copyResult = document.execCommand("copy");
        if (copyResult) {
            //移除
            document.body.removeChild(input);
        } else {
            navigator.clipboard.writeText(str);
        }

经过测试没发现问题，直到一部iPhone 6的出现。。。

修改版实现方案：基于clipboard.js实现

在网上搜索很多人推荐clipboard.js，于是果断改用clipboard.js实现功能

    var clipboard = new ClipboardJS("#copyCode",{
        text : function(){
            return document.getElementById('referralCode').innerText
        }
    });

    clipboard.on('success',function(e){
        console.log("复制成功")
    })

然而那部iPhone 6还是不行。。

最后将span标签改成了button，终于搞定了。