之前休息时候写了一个分享功能模块,里面有一个复制按钮分享一下。
html:
<div style="position: fixed;top: 50%;left: 50%;margin:-100px 0 0 -100px">
<input type="text" name="" id="text" value="" class="share-url" />
<span>
<button type="button" class="btn btn-info copy" onclick="copy()">复制链接</button>
<textarea id="input" style="opacity: 0; height: 1px;">这是幕后黑手</textarea>
</span>
</div>
js:
function copy() {
var text = document.getElementById("text").value
var input = document.getElementById("input");
input.value = text
input.select();
document.execCommand("copy");
}
style:
.copy {
display: inline-block;
padding: 6px 12px;
margin-bottom: 0;
font-size: 14px;
font-weight: 400;
color: #fff;
background-color: #5bc0de;
border-color: #46b8da;
border: 1px solid transparent;
border-radius: 4px;
}
#text {
margin-bottom: 10px;
width: 40%;
padding: 6px;
border: 1px solid #666;
}