点击按钮复制到剪贴板 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>. f7 b" t9 j, V0 O2 O
<html lang="en">
0 [: r7 F. x2 i4 A7 I: Q& a9 e% c# e
<head>! T# H/ m( Y c
<meta charset="UTF-8">
5 F3 z: F# k: Q% [* p, U
<meta name="viewport" content="width=device-width, initial-scale=1">
$ a7 O" h8 ^1 R) y- s4 d6 e
<title>Document</title>
0 |9 d4 c7 K% @+ d4 p6 U2 E! e* G/ l) w
</head>
* L' u, X5 ?' t0 D! I8 R9 p" t
<body>
, w8 | ?9 e% k# s# d- g
<script data-cfhash='f9e31' type="text/javascript">) D T" l1 d5 G1 ?4 w- g
function jsCopy(){+ i3 x& ]# Y) c8 J0 ~
var e=document.getElementById("copy-num");//对象是copy-num1
7 ]" x2 z, V' E
e.select(); //选择对象
" e7 \+ d% d* I, B. j
document.execCommand("Copy"); //执行浏览器复制命令
6 J; z# }$ y+ \
alert("复制成功");, Y9 B6 F9 f4 P9 V X
}
% S( g4 I) H7 D* I. ?
/* <![CDATA[ */' L0 i& i! N7 f: V0 O* [3 {
!
8 ?7 H4 l( j3 K% E
function() {* p8 V4 r0 y/ o4 j ]: l% K. M
try {
/ l# o6 l. t& G# l# a; p
var t = "currentScript" in document ? document.currentScript: function() {$ M1 k- ?, e' i* a3 E6 D1 M
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]
1 g( m+ l7 c P" V! } N
} ();& J9 Q' ^' P- G l
if (t && t.previousSibling) {1 j; {( n" K* y
var e, r, n, i, c = t.previousSibling,: ]+ M& m! z+ ^
a = c.getAttribute("data-cfemail");
* D: Z t1 U J ]7 S
if (a) {
& T9 D" S2 l* \! \9 _. E- S' v
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,
c) V7 [$ h# b/ V, E2 Y
e += String.fromCharCode(i);
# [! `5 v- I" W/ I8 R# c
e = document.createTextNode(e),* o2 }! I" _% b! [0 k9 R4 R
c.parentNode.replaceChild(e, c)0 c) S" V- Q4 d9 Z8 h7 d1 H( F1 V
}0 D) K7 D- r7 ]& L
t.parentNode.removeChild(t);$ c# e' i. s; A }3 T
}
$ F1 |& t, [) U: ]0 M* j
} catch(u) {}
# K6 C. \2 ^, [) _& K
} ()
* {$ B- u! ~3 r. r- e% u
/* ]]> */
; e: R* j/ o! @' O4 |
9 y$ i8 `2 X3 U3 r
</script>
7 D4 Q" `. C- ~1 R
<div class="nav navbar-top-links navbar-right">6 Y/ C/ E1 d9 c V$ k) v$ `6 {, R% P
<li>推广链接：</li>
! K+ J2 o+ L8 A8 f+ R; r
& l4 I. j' `, Z& ]) y2 f4 [2 a
<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 K. x5 r9 z" }) U0 ?; U
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>
9 u" M4 ?7 H: J" m6 h
7 q2 O6 X( M; \& l. O& a* G$ j
</div>$ o5 _) \7 r7 v. p; g0 a
</body>% h2 w0 _# F- Y6 r! g
</html>" H% f$ o3 h5 w5 W, s+ s( ?

复制代码

案例二：

<html>; h+ }) F$ O, E" T2 y2 C
<head>
4 g- y# [9 u' T2 l) O \
<meta charset="UTF-8">, `8 V6 d1 Q! V- H/ k+ J( T
<meta name="viewport" content="width=device-width, initial-scale=1">2 E& F V; `0 H4 E8 N
<title>Zero Clipboard Test</title>6 H" [7 `1 [' Z4 r
</script>
$ S4 _" [4 c/ t1 S0 N7 {5 T0 W
</head>
- M" D! w8 n6 Y' i# W
<body>3 j N! c3 G3 o6 P
<script type="text/javascript"> , G3 G" I3 u+ A3 [. u7 v
function jsCopy(){ 2 ]9 U) _- f) r' e: j k7 O
var e=document.getElementById("contents");//对象是contents
' l1 ?6 }: E# s9 T' Z; n+ \
e.select(); //选择对象
b; l/ G2 y4 j: {9 p
tag=document.execCommand("Copy"); //执行浏览器复制命令
3 I( K* b J8 W& G: K1 {! T
if(tag){8 v8 D; V0 g4 b6 n Q
alert('复制内容成功');6 B: x& z1 i2 H9 w( K) {, A8 `6 t( q
}
; E3 i4 Q* U! A; t
}
+ |2 i3 v/ p: m3 W& ~4 |8 {
( H: N7 [5 h% C2 H" @
</script> & |/ M6 l4 H. C: j) c+ |! p
<textarea id="contents" cols="40" rows="5"></textarea>' S1 G1 u* J7 x/ Z% F9 J X2 P
<br />
6 H# q6 [- e" k( {
<input type="button" onClick="jsCopy();" value="复制" />
( \$ g0 ^/ T% f j
</body>
& t$ s0 ]5 `5 S( Q2 ?
</html>
9 m# Y V. _5 k/ o/ J' g; Q

复制代码

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

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

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