Creator H5 如何实现复制文字到剪贴板

Creator 2.x
#1

如题，

native的还好 调用iOS安卓原生的接口就可以了 h5版本怎么弄？
求大神帮帮忙，谢谢！

3赞
#2

copyToClipBoard(str) {
if (cc.sys.isNative) {
//原生自己实现
} else if (cc.sys.isBrowser) {
var textArea = document.getElementById(“clipBoard”);
if (textArea === null) {
textArea = document.createElement(“textarea”);
textArea.id = “clipBoard”;
textArea.textContent = str;
document.body.appendChild(textArea);
}
textArea.select();
try {
const msg = document.execCommand(‘copy’) ? ‘successful’ : ‘unsuccessful’;
cc.log(“已经复制到剪贴板”);
document.body.removeChild(textArea);
} catch (err) {
cc.log(“复制到剪贴板失败”);
}
}
}

2赞
#3

谢谢兄弟 但是打印出来的msg是unsuccessful 是什么原因呢？ chrome和手机上的safari都是这样

#4 
webCopyString: function(str){
    console.log('复制');

    var input = str + '';
    const el = document.createElement('textarea');
    el.value = input;
    el.setAttribute('readonly', '');
    el.style.contain = 'strict';
    el.style.position = 'absolute';
    el.style.left = '-9999px';
    el.style.fontSize = '12pt'; // Prevent zooming on iOS

    const selection = getSelection();
    var originalRange = false;
    if (selection.rangeCount > 0) {
        originalRange = selection.getRangeAt(0);
    }
    document.body.appendChild(el);
    el.select();
    el.selectionStart = 0;
    el.selectionEnd = input.length;

    var success = false;
    try {
        success = document.execCommand('copy');
    } catch (err) {}

    document.body.removeChild(el);

    if (originalRange) {
        selection.removeAllRanges();
        selection.addRange(originalRange);
    }

    return success;
},
4赞
#5

getSelection is not defined
在其他敌方都正常，但是微信小程序上，不能使用

#7

这是一个安全考虑，因为exeCommand()可以操作系统剪切板，有可能被恶意利用。所以你不能用JS“直接”调用execCommand(‘copy’)，而需要放到某一个有用户出发的事件响应函数内，如
`

`
#8

1.前言
小游戏功能中有复制公众号的功能。

2.代码
wx.setClipboardData({
data: self.id, //公众号id
success: function(res) {
wx.getClipboardData({
success: function(res) {
console.log(“复制成功：”, res.data);
}
});
}
});

作者：爱睡觉的猫L
来源：CSDN
原文：https://blog.csdn.net/haibo19981/article/details/81224054
版权声明：本文为博主原创文章，转载请附上博文链接！

#9

不错，

#10

mark H5 剪贴板

#11

马克！！！H5剪切板

#12

微信小程序 ≠ H5

#13

马住 但是好像不能实现？

#14

好像ios不生效

#15 
function copy() {
    var el = document.createElement("textarea");
    el.value = this.labKami.string;
    el.setAttribute('readonly', '');
    el.style.contain = 'strict';
    el.style.position = 'absolute';
    el.style.left = '-9999px';
    el.style.fontSize = '12pt';
    document.body.appendChild(el);
    var selected;
    var selection = document.getSelection();
    if (selection.rangeCount > 0) {
        selected = selection.getRangeAt(0);
    }
    // el.select();
    selectText(el, 0, el.value.length);
    try {
        const msg = document.execCommand('copy') ?
            'successful' : 'unsuccessful';
        G.ToastMgr.addToast("复制成功");
    } catch (err) {
        G.ToastMgr.addToast("复制失败");
    }
    document.body.removeChild(el);
    if (selected) {
        document.getSelection().removeAllRanges();
        document.getSelection().addRange(selected);
    }
},
// ios 兼容
function selectText(textbox, startIndex, stopIndex) {
    if(textbox.createTextRange) {//ie
        var range = textbox.createTextRange();
        range.collapse(true);
        range.moveStart('character', startIndex);//起始光标
        range.moveEnd('character', stopIndex - startIndex);//结束光标
        range.select();//不兼容苹果
    }else{//firefox/chrome
        textbox.setSelectionRange(startIndex, stopIndex);
        textbox.focus();
    }
}
#16

复制到粘贴板之后，显示successful,但是还没没法粘贴，我在别的输入窗口粘贴，没东西可粘贴。

#17

陈年老帖都有人翻出来了, 多搜索github.
https://github.com/zenorocha/clipboard.js

1赞
#18

mark H5 剪贴板