H5移动端 控制剪贴板

Posted 2023-04-16

参考技术A 这几天提过来需求，H5这边要控制剪贴板，复制协议，app打开跳出口令。

于是看了zeroClipboardJS。但是都是基于falsh的。移动端上没法用。

最终看到了 clipboardJS  

地址：https://clipboardjs.com/

超级小巧而且兼容性好的插件！！！

移动端 点击 复制到剪贴版

$(‘.copy‘).click(function(){
　　var text=$(this).prev().children().text()
　　const input = document.createElement(‘input‘);
　　input.setAttribute(‘readonly‘,‘readonly‘);
　　input.setAttribute(‘value‘,text);
　　document.body.appendChild(input);
　　input.setSelectionRange(0, 9999);
　　if (document.execCommand(‘copy‘)) {
　　　　input.select()
　　　　document.execCommand(‘copy‘);
　　}
　　document.body.removeChild(input);
　　$(‘.clipBoard_notice‘).css(‘display‘,‘block‘)
　　clearTimeout(this.delay)
　　this.delay=setTimeout(function(){
　　　　$(‘.clipBoard_notice‘).css(‘display‘,‘none‘)
　　},2000)
})