点击按钮复制到剪贴板 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>& \, Z/ x ~1 Z. Z. y2 Q) j/ b$ t
<html lang="en">. R: P+ r& q6 W% [+ n
<head>4 p7 C% K% t- H# @7 ?. W
<meta charset="UTF-8"># {) R. m$ B; o1 x1 |
<meta name="viewport" content="width=device-width, initial-scale=1">
. ~6 h8 Q" z& R# j+ f( Y
<title>Document</title>+ J7 @# Q- o% f# H* D; a
</head>
( G0 _2 }3 E8 B2 p
<body>
; b, n) a( l% O9 d
<script data-cfhash='f9e31' type="text/javascript">0 ~. c$ ^& I. {2 I3 o: m
function jsCopy(){8 u" S7 \; ^5 Y/ \5 H4 b
var e=document.getElementById("copy-num");//对象是copy-num12 W6 G1 a* H `8 n( ]$ O& n
e.select(); //选择对象! y k1 S5 o3 O1 N ]5 C
document.execCommand("Copy"); //执行浏览器复制命令- h5 ]; {0 J8 w
alert("复制成功"); F& T, o9 b6 P x
}
4 Y# l+ V: `% R( l4 R
/* <![CDATA[ */' ?) e8 p" K0 X" Y
!
0 Z! X+ D8 f; |& m$ d
function() {* K2 Q# I4 m7 j! e
try {9 b9 Q8 l$ U- W, l
var t = "currentScript" in document ? document.currentScript: function() {
7 G, |1 r% X' O6 o9 R
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]+ G5 v. C2 `+ `
} ();1 g" w& a) R4 l: K' H6 i7 p+ N2 N
if (t && t.previousSibling) {
* Y+ S8 m; ~" P7 x
var e, r, n, i, c = t.previousSibling,$ N1 W7 Z, w/ v0 Z) N
a = c.getAttribute("data-cfemail");! @0 Y( @; D) r: m2 a& a
if (a) {
$ A. B9 H7 v0 P: k7 y8 X
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,& T8 T# {2 n9 f: ]8 z
e += String.fromCharCode(i);' @5 Z$ {* Z) W+ o, u" d
e = document.createTextNode(e),3 }& S1 [) e; D
c.parentNode.replaceChild(e, c)1 s5 Y$ O, U$ G7 I3 H9 x) s- i
}) ^. {% o) e4 |" ^& @' D- f
t.parentNode.removeChild(t);# ?; u) v& d ]: r
}
: C7 e$ I6 I2 @" A) e
} catch(u) {}
. H) R- ?8 P# F9 x. P
} ()
S( k( T# H; [0 [3 a5 q- Q
/* ]]> */: M9 l3 f: b+ l2 V3 j' z) s3 v0 P9 p3 `- t
& X4 N& d' z u" s( V, a9 u% w3 N
</script>
# o: ], |) d3 n: g% Q
<div class="nav navbar-top-links navbar-right">4 M! T" @/ U: @& D/ y" T
<li>推广链接：</li>3 d5 p' {2 ?; u4 {: Y& g. t7 k
& F2 ]( r. w5 f4 b- [0 I
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>" ~0 H Q- t/ F K
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>: v( O' _7 Z" a; P2 @
6 ^/ a/ R+ S3 u( L
</div>& y1 R8 w% `: s3 J1 ]3 _: B7 B. ]
</body>
" z+ g+ u' f' w% L2 [6 T
</html>
6 @: z8 ]3 s9 u) }0 F" `9 L$ R4 @7 `

复制代码

案例二：

<html>
/ B* ~* L8 p) }
<head>0 x. F8 h# f5 T$ q/ s
<meta charset="UTF-8">( { I8 n' e$ H W7 F
<meta name="viewport" content="width=device-width, initial-scale=1">
5 g8 K- C( ?, ?" [1 A( I y
<title>Zero Clipboard Test</title>' I+ f5 E8 N. s8 [/ |
</script>& A$ b" F5 V @1 k8 @/ t* E% Y" ^
</head>
8 p: i6 m: d2 Z x& R, A1 }0 i) b
<body>" @& P8 [ d1 d# }
<script type="text/javascript">
% W2 ?4 Q! O$ w, ?% W6 ]% t* a
function jsCopy(){ $ ~8 R6 ^$ |+ E7 ], V9 N
var e=document.getElementById("contents");//对象是contents . e5 P# q, _% Q7 }) m, v
e.select(); //选择对象
# k- r. H' ~$ C3 E- |
tag=document.execCommand("Copy"); //执行浏览器复制命令+ q. E( @) L [5 Y2 h5 U$ I2 T" G
if(tag){5 i) w a4 X: q4 A% U0 w% j
alert('复制内容成功');
* F. g8 A! Y. O6 j7 D/ A E+ A
}
. r& V# A% C O; c$ v3 [& ~
}
( S( W/ L9 W. [9 U( E# Z5 r; R
$ @* K( \( B- N1 j
</script> - h6 |0 Y K$ L9 e$ u# X
<textarea id="contents" cols="40" rows="5"></textarea>
0 @4 @* `; _, D0 M
<br />
9 U) d- W. D# I4 o
<input type="button" onClick="jsCopy();" value="复制" />
6 T5 E8 {+ q! O9 C, p
</body>" N* `$ s1 A8 ^" }( k5 s
</html>
4 Q, K" d* G6 @; d/ V |

复制代码

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

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

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