H5前端js中自动复制功能:简单说下就是点击一个按钮触发事件,然后PC页面或者手机上的快捷粘贴都会被绑定复制值。
万变不离其中,我还是喜欢用原生的方法document.execCommand('copy')。网上也有些第三方js封装了这个方法属性,但是浏览器会有兼容问题。
先从html开始吧,如下:
<label id="cSharingLinks" style="opacity:0;position: absolute;z-index:-999" >123</label>
<input type="button" value="复制" class="btnCopySharingLinks" />
第一个label标签用来存需要绑定复制的值。
注意:我之前用的input 的文本框,然后复制后粘贴出来会有2个换行,我是琢磨了半天去不掉,然后换label就收工了。
这个标签不能用这些方法隐藏( jquery.hide()、display:none ) ,不然Copy失败。但是加了些样式给他变透明、漂移、置底 差不多也是个隐藏就行了。
第二个input按钮主要用来触发事件,