最近项目中遇到一个需求 ：
html5页面 点击立即邀请出现分享弹窗 然后点击复制链接区域复制 自定义链接（拼接网站注册链接 + 邀请码） 到剪切板 如图：
在网上搜到 clipboard.js 可实现需求 。
clipboard.js GitHub:https://github.com/zenorocha/clipboard.js 网址：https://clipboardjs.com/
此插件 使用纯 JavaScript （无需 Flash）实现了复制浏览器内容到系统剪切板的功能，可以在浏览器和 Node 环境中使用。支持 Chrome 42+、Firefox 41+、IE 9+、Opera 29+。
项目代码 ：弹框 和 实现copy部分
最后将 链接插入#foo 中，如图
实现需求：弹框出现时，button 定位覆盖 点击区域
======================================================================================
还原原形如下：
html 部分:
<p id="foo">这里是复制内容</p>
<button class="btn" data-clipboard-target="#foo" aria-label="复制成功！"></button>
js 部分:
<script type="text/javascript" src="../public/js/clipboard.min.js"></script>
<script type="text/javascript">
var clipboard = new Clipboard('.btn');
</script>
坑（移动端遇到的问题）：
1：上述 p 标签 不能 隐藏 ——隐藏会导致复制失效（可以用tex-indent 隐藏内容，或者 改变文字颜色为页面底色 来hack）
2：上边html 内容 不能出现在弹窗中————导致复制失效
此处弹窗
a:用定位 到屏幕外侧 （left：-200%；），出现弹窗（left：0；）实现的，html 内容 在弹窗中 复制也会失效。
b: 用 display:none; display:"block; 实现 同1
3： 不能用 trigger（“click"）模拟 来触发 .btn 实现复制——导致复制失效