最近给运营人员做了个微信html5的刮奖活动页面，上线以后，用户反馈了一些问题，于是运营人员让我们给加点小功能，就是给中奖列表那里加个点击复制qq群号的按钮。
如图：
这样，当用户获奖后，点击复制群号，就可以直接到qq软件里粘贴后查找qq群了。
但是从百度搜了一圈后，发现基本不好使，有个方法是window的粘贴板方法，但是只能用在ie内核的浏览器上，还有个方法如下:
$("#qqQunCopyBtn1").on('click',function(){
var e=document.getElementById("awardQqQun1");//对象是content
e.select(); //选择对象
document.execCommand("Copy"); //执行浏览器复制命令
alert("群号复制成功");
});
后面这个方法只能复制input输入框的内容，但是起码还能用。百度还查到了些引入插件的方法，但是也有各种限制，所以还是想办法用这个input输入框的复制功能更好些。
然而input输入框的这个复制方法也有问题，那就是input框只能是type="text"，而且input框也不能设置style="display:none;"的样式，然后又是各种调啊，最后想到了一个办法，绕过了这种限制。
那就是让input框所在的div被其他div覆盖，这样的话input框也相当于对用户隐形了。然后就完美实现了这个功能。
具体相关代码如下：
首先用大背景图的div覆盖input所在的div
然后加一个button
给button加一个点击事件
$("#qqQunCopyBtn1").on('click',function(){
var e=document.getElementById("awardQqQun1");//对象是content
e.select(); //选择对象
document.execCommand("Copy"); //执行浏览器复制命令
alert("群号复制成功");
});
这样就搞定了。
(转载本站原创文章请注明作者与出处Coding云--codingyun.com)
