点击按钮复制到剪贴板 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>
0 F9 ? S' p4 S* k+ _0 ^2 e& H+ O1 ~
<html lang="en">
: I7 u0 y/ W8 S: l' @/ Z. l
<head>' B) B" j4 Q0 r+ l' T
<meta charset="UTF-8">6 ~3 p) F1 j6 L. Z% a5 u$ i T3 [4 n
<meta name="viewport" content="width=device-width, initial-scale=1">
$ i( A7 s# E; k
<title>Document</title>
, J8 ~( O, |1 p V0 X' C
</head>; c' J, V* E$ i. e0 A+ H6 o
<body>
6 j1 a, q e0 R( {/ n& z
<script data-cfhash='f9e31' type="text/javascript">1 b$ D v2 l: m* p: k5 }
function jsCopy(){
* x; d6 d H3 \
var e=document.getElementById("copy-num");//对象是copy-num1
* ~8 F5 Y2 R v3 S; `1 j0 C
e.select(); //选择对象
% u1 u2 N0 z* E) E
document.execCommand("Copy"); //执行浏览器复制命令1 w5 h" g# J5 q% R7 ]
alert("复制成功");5 M l* v5 Y. u$ ]8 W
}
# H9 ]7 R! `& l! F$ J
/* <![CDATA[ */
) k( F% W* S5 m, E4 O" o) C% S
!
, q5 d6 f' E& \; b/ [" F& ]0 ]
function() {
4 |6 Z7 u+ i7 a0 J
try {
- a6 \: g+ |6 q3 ?
var t = "currentScript" in document ? document.currentScript: function() {
) s7 A* i& X, s) P8 ?3 h$ ]% F- U
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]( `8 M* r3 K1 d+ n6 N
} ();
& ?0 }$ _: J4 o8 F: ~0 u
if (t && t.previousSibling) {
d2 _% L# F' p. F
var e, r, n, i, c = t.previousSibling,/ k g0 A3 N+ e( i
a = c.getAttribute("data-cfemail");
/ h, B- `( Q9 P( Z
if (a) {$ [ ~9 |9 U, c s" {
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,* F' O( R. ]. s) m/ m& ~
e += String.fromCharCode(i);
4 C( z8 V" r8 B$ g7 f4 C% ~8 y
e = document.createTextNode(e),( Q& ?' F6 G; ^# ~) a: O
c.parentNode.replaceChild(e, c)
! l- x1 w% `& T; h$ C. H$ V
}
" e P# ~5 s8 s: w
t.parentNode.removeChild(t);
+ M5 o3 Z' D4 k6 M
}" P6 R. S- d5 A. D5 b1 _
} catch(u) {}6 V: |6 d0 q/ r n* v3 t# r* J
} () C2 f8 ^7 J+ k6 O& D
/* ]]> */
' q' A+ K3 m& e
% T0 ]% S$ H+ y" c; x
</script>
1 ^- G% _: n7 E2 M
<div class="nav navbar-top-links navbar-right">0 I# [5 [6 g0 v! ]) }$ f
<li>推广链接：</li>) S+ g7 N& d9 u$ _. O" `
0 K0 d6 R' M2 `
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>
$ g: a! a& E6 W, c
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li># a3 E4 e4 T# u/ B% W2 T2 p7 B
/ z5 A3 v9 K4 {8 U! M
</div>4 u" t9 W" R7 z: r" U
</body>+ B) r; ^% F$ F+ |# b) O6 y, v6 a
</html>
1 s k, m& w, K/ }9 X, Q' y3 g

复制代码

案例二：

<html>$ d2 G; C8 i6 ^! ?/ G% m) x. L
<head>
& Z' q6 Z- p1 T( O: B; ^
<meta charset="UTF-8">2 U0 f& s# _; e0 j
<meta name="viewport" content="width=device-width, initial-scale=1">
) J5 X5 f; W- o k# A
<title>Zero Clipboard Test</title>- y% F0 s5 }" V% i. R( o9 \
</script>
K( f6 N( j# u. q
</head>9 o" h5 h d# s! s [* k- r
<body>
7 n0 w$ g- Y" z
<script type="text/javascript"> & B! s8 L6 }9 V
function jsCopy(){ # V$ ~3 a3 B8 W; P: I; K
var e=document.getElementById("contents");//对象是contents
' A+ K( E) D( S' B( Z
e.select(); //选择对象 ; Q* q0 l" Q% ]( z9 b
tag=document.execCommand("Copy"); //执行浏览器复制命令
- F* [2 ~1 {( o& j$ s
if(tag){! c# b" B x. D- i) k
alert('复制内容成功');. m% l. a( v) p
}
! m$ _9 y2 w, I$ G$ {3 c1 `+ o
}
; ?8 C' _, J1 h1 P
: `9 Q$ g+ W9 h! `! B2 q4 K
</script>
. V! i8 W+ m4 b! z- D. }
<textarea id="contents" cols="40" rows="5"></textarea>
4 |: O* B: N/ S; R* f
<br />
8 @# i: r8 `$ ~4 O0 F7 E
<input type="button" onClick="jsCopy();" value="复制" /># X" l7 z6 [7 u6 y) ~8 p# f
</body>
2 P' s- e( b5 E2 I' {* g
</html>8 n* t' |$ I+ Y

复制代码

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

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

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