点击按钮复制到剪贴板 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>
1 O& a4 I5 R7 n; t' x, n
<html lang="en">. x' e$ ~. d7 m2 s8 \
<head>
1 E; Q1 f, R1 |/ \( Q0 C& f
<meta charset="UTF-8">
7 N$ [: U4 ?* f7 e/ W, ?
<meta name="viewport" content="width=device-width, initial-scale=1">
2 L) ^- B" n0 B; j& t; R+ a) f6 F
<title>Document</title>" j& x$ w) X+ `. }
</head>7 ^4 }" ^# [0 J8 B: e. `& n# H$ _
<body>
{" Q. N1 ^" `
<script data-cfhash='f9e31' type="text/javascript">2 X* O, {% {) _$ a; O* @
function jsCopy(){
- H4 [' J. o8 ]- l0 m8 I
var e=document.getElementById("copy-num");//对象是copy-num13 f0 Q6 {$ z! C: F3 I
e.select(); //选择对象1 N4 Y- ?$ X( r& O7 J
document.execCommand("Copy"); //执行浏览器复制命令
1 ^8 @& ~4 k6 v" u5 g! O) t
alert("复制成功");2 |9 t1 J' h- O! ~" n, D
}
$ ^. |# h; V5 ?$ v; V7 ~8 j0 R6 B
/* <![CDATA[ */
2 r5 ^7 p$ A% q7 {) H3 H7 K6 \
!& u( Z! E" g/ g& S% w
function() {
" |: R4 n$ {# M( i1 r
try {1 F7 a6 a+ w! P" ~
var t = "currentScript" in document ? document.currentScript: function() {
: Z/ V1 r3 N/ C# W! [
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]
- V/ ?4 s' L6 f4 H4 S
} ();
. e" r8 n; E0 Z( B. o
if (t && t.previousSibling) {
' h: n3 U6 z- r+ j* _
var e, r, n, i, c = t.previousSibling,
2 j0 X5 x/ E7 n7 [, b1 H7 d
a = c.getAttribute("data-cfemail");
- z# Z. J) i. G4 n3 ^9 P
if (a) {/ ^+ Y; j: B2 C4 L& \
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,) y1 |' W. D& p7 W0 R, G
e += String.fromCharCode(i);0 z$ a* e3 F, }. ? B( }7 ^7 Y
e = document.createTextNode(e),
3 h3 S, t% G0 I# ]
c.parentNode.replaceChild(e, c)
1 o) H2 {8 P) @/ E4 X9 R t
}
- R$ X+ ^: B! r; `) A% r. X% c
t.parentNode.removeChild(t);8 B: B( V7 b" L j, g& Z
}: F( M; z3 j! E+ U
} catch(u) {}# E, a; y7 f0 O8 C/ v% e( I1 O
} ()
/* ]]> */6 r, T6 |5 p% v4 Y; u7 I, H
: U Y4 n& X5 F. N) U' `" Y8 e
</script>+ C$ K* y7 v4 o$ k' B
<div class="nav navbar-top-links navbar-right">& D$ e( q6 O5 l# I: O0 N
<li>推广链接：</li>
0 g b: `0 Z+ k
3 m# y. q/ x0 Y# o
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>' Z0 \. b0 y# A* M0 y' G: L
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>- k% f. d7 I5 G; { u
' i7 O- B( e6 h9 u+ A6 F4 ]
</div>/ X% E9 A& Z6 r$ U
</body>0 `0 A' O( ~% w5 Q: \ F' O; q
</html>- _ A, b: T* M5 J

复制代码

案例二：

<html>
2 p4 \" H7 A7 x# H0 Q8 V; R' B
<head>
+ A5 D/ `; o0 V7 U3 ^# p
<meta charset="UTF-8">: H7 @6 N/ p5 r4 w* v" P0 J
<meta name="viewport" content="width=device-width, initial-scale=1">
2 K9 \; [( v) c7 N5 o, S
<title>Zero Clipboard Test</title>
- l5 ? ]8 n# f" [- ^( ? R) Y7 T
</script>
3 R4 B8 b6 O+ e! c1 @! k
</head>4 J8 @/ v$ c/ H5 H/ ]: S
<body>% l' t' Y- e7 t' O* P/ Y# f
<script type="text/javascript"> $ d9 ^& P, N- v5 |7 h& S. y7 Q$ a
function jsCopy(){ 1 c1 J* V) F& U! j2 |1 Y
var e=document.getElementById("contents");//对象是contents ) f0 `8 F5 A8 i# e
e.select(); //选择对象
5 M# |, U4 R Q$ k9 D. V0 s
tag=document.execCommand("Copy"); //执行浏览器复制命令; o2 v/ W' d( C% ]1 j7 q- p
if(tag){
1 ?: x6 ^6 q' B* p' u
alert('复制内容成功');
3 k4 j0 J, A- ?; H" ?
}
- F# ^. r$ [7 {5 C1 F& V
} 1 O' r+ i( L8 ~
6 A2 `' g! `# T) r; i; S2 ?
</script> 2 I1 Q o; }4 w& T z; ^
<textarea id="contents" cols="40" rows="5"></textarea>
+ u7 w' K( j N+ T9 G
<br />9 q0 |5 |+ J& G4 f) s% |' T
<input type="button" onClick="jsCopy();" value="复制" />
. s( p1 B% m) x4 H5 j* N, j" W
</body>
: c( ~. Z, \" B' h& e6 ?9 L
</html>( H, H: [" p1 |7 e8 e

复制代码

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

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

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