点击按钮复制到剪贴板 js

admin · 发表于 2018-7-31 10:14:54

<blockquote><span style="font-family: Arial, Helvetica, sans-serif;">案例一：</span>

复制代码

</pre><pre code_snippet_id="1755225" snippet_file_name="blog_20160711_1_4917192" name="code" class="html"><!DOCTYPE html> [- i3 F1 l# b7 d: ]- C7 ^3 \
<html lang="en">
5 |+ s. t5 u5 [, x I; n
<head>
8 k8 d* D5 m1 @6 l6 U$ m
<meta charset="UTF-8">0 H& P$ P8 p' w6 c- K9 k5 X2 k- X6 K
<meta name="viewport" content="width=device-width, initial-scale=1">
( {( }5 Q+ w$ X( e
<title>Document</title>
' H$ c l L9 V- ~
</head>' S: _: l$ u, v$ \- j
<body>
7 T3 `$ k \& n0 ?; I2 R2 R
<script data-cfhash='f9e31' type="text/javascript">
( C7 e. a0 o' W6 v
function jsCopy(){; r+ q: P, [$ R# e x
var e=document.getElementById("copy-num");//对象是copy-num1
e.select(); //选择对象
2 U5 \* U8 o$ {& K& x1 c! Q
document.execCommand("Copy"); //执行浏览器复制命令
+ i" F* f7 ?- V0 p$ U1 B6 u
alert("复制成功");
0 s, c) T L9 J, a
}) m" P( i% x% I$ N* W
/* <![CDATA[ */
( @! ^/ M0 r5 V" h4 T: T; _
!
6 @% u/ s- ?" Y8 s7 _+ I n
function() {
# J9 V: R9 t& }, f
try {
( q4 H* c4 A' y
var t = "currentScript" in document ? document.currentScript: function() {
9 ?$ E/ Z& p% c; a1 _
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]
: K: }/ Z+ }! \
} ();$ O7 p/ I* x- e: S" d; p
if (t && t.previousSibling) {
- n" C& T. |7 E' P9 [4 I E+ o7 ^
var e, r, n, i, c = t.previousSibling,1 u" K- o, V6 H* I
a = c.getAttribute("data-cfemail");% Z1 d; u. H4 \" K
if (a) {
& y, W* E& s5 c. u6 _1 e" p
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,
% Y4 {6 R8 ~7 f$ A
e += String.fromCharCode(i);* a$ V+ [: q7 `& S
e = document.createTextNode(e),: B: p+ ^1 o1 j. u
c.parentNode.replaceChild(e, c)
) R, G/ A/ \1 L- E! A+ _$ N% W8 F
}
9 a7 ~9 W; |- Y( T4 J! a
t.parentNode.removeChild(t);
; D' @! ^: x9 g
}$ n6 W; u) ~! }
} catch(u) {}# N% B+ Y& v4 l' R& U
} ()
/ d- T' c8 p% O9 ~+ r. K
/* ]]> */; f" I* U2 S0 p8 B9 a9 x% p
5 G) _: x: K& g& H, n3 j0 x
</script>
1 g9 h( |* R$ t, d3 G& q& x
<div class="nav navbar-top-links navbar-right">
; r, `; S! O6 `3 o* t: Y
<li>推广链接：</li>: ~8 b; q; `4 k1 g: }
4 v% U7 v/ t) k' }+ d# e# p
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>
$ Q! R1 C& Y# T. X( {
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>! u5 J! Z# t* ^1 Q- C# K
: [& V! Q. z' _+ f4 l3 K
</div>5 v- \2 Y8 z- w
</body>
" v: B* y) l2 ]2 p
</html>* R2 p, _! }1 k* m6 Q

复制代码

案例二：

<html>
6 C) i0 [* _4 L
<head>- G- v5 e+ e2 h, B `. B8 C3 O% l
<meta charset="UTF-8">7 I4 c$ \" e$ N0 f
<meta name="viewport" content="width=device-width, initial-scale=1">
c$ d7 ?. r1 r4 x4 @
<title>Zero Clipboard Test</title>0 a C" g* G* E' o
</script>
( R, w" @2 l" `* \
</head>2 C6 Y" `! m- w7 z+ J. ~, a
<body>
: y2 l* k2 w1 i( ^
<script type="text/javascript">
- ^8 s% L$ X6 e) G' O
function jsCopy(){ * @' N% _% k1 H
var e=document.getElementById("contents");//对象是contents s( ]$ w8 u' _- L, k; V6 H, L/ ?
e.select(); //选择对象
[& q# S2 k- u5 `- ?: P. S
tag=document.execCommand("Copy"); //执行浏览器复制命令
; L6 ^4 c$ d: B/ C
if(tag){ f4 V. v# ^6 Y+ c# Z v S
alert('复制内容成功');
7 h% M. J/ U! n' Z5 E
}
2 N6 T" _- @! A% q
} - N+ Q! D F& Q; B6 e# l! l
) t3 ]( @- z9 d; g/ M
</script> ) \7 t" ]2 G) K6 Y
<textarea id="contents" cols="40" rows="5"></textarea>$ q4 M9 ~, a6 P# N" S4 J# V% u6 K
<br />
7 A5 X: L9 F4 Q! |* W9 X# B$ M# Q
<input type="button" onClick="jsCopy();" value="复制" />$ {( J# G5 }0 Y8 W) V9 `4 f! Y
</body>4 M0 h+ }/ K! f: h @ w1 `
</html>
. Z$ J" |3 P/ p; x' l% E

复制代码

以上都可以执行，亲自测试！

帐号		自动登录	找回密码
密码			立即注册

[js学习资料] 点击按钮复制到剪贴板 js

浏览过的版块