点击按钮复制到剪贴板 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 C3 W! Y" n$ c) A
<html lang="en">: I2 k/ ~' u8 X3 E2 h
<head>
1 U+ `2 W, L0 Y
<meta charset="UTF-8">
3 R9 g+ @7 o5 c8 W4 T+ G
<meta name="viewport" content="width=device-width, initial-scale=1">- w3 S/ Y+ l' }# o# T& ^
<title>Document</title># d& \- z- V* N. A5 R; o
</head>
0 J* W! L0 x: k" G* M" I( O1 K
<body>: U! a, x& Z& _
<script data-cfhash='f9e31' type="text/javascript">
( Q( f/ U0 W! t; p3 h) |4 S
function jsCopy(){
' {- }, Q5 a8 p
var e=document.getElementById("copy-num");//对象是copy-num1
7 Z U( C: T7 S& V2 O3 s: k6 x
e.select(); //选择对象
. R9 w& T! E% C" S3 Y D
document.execCommand("Copy"); //执行浏览器复制命令
q. X/ }/ y0 [
alert("复制成功");
7 e/ c$ [- Q% _& q6 r3 v
}
& Q6 C: A9 ]$ x4 Y2 K
/* <![CDATA[ */
0 |4 \3 y$ E. u; ~2 c4 f( P
!
+ O4 ^5 g( t8 Z1 q) W* U
function() {
3 O' Y: D& [) M9 P
try {
2 f* C5 \7 G4 \3 R; I9 k5 `/ H
var t = "currentScript" in document ? document.currentScript: function() {& x& u3 L a7 k5 ]7 ]
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]
0 Q9 V, @" p8 w# X2 L7 w; y- V
} ();/ d1 |6 L5 b$ a4 D( N0 Z" R
if (t && t.previousSibling) {; C+ d j5 Y9 X/ F. m% ~1 J
var e, r, n, i, c = t.previousSibling,
5 U8 L; }. x9 }9 R
a = c.getAttribute("data-cfemail");
; h+ e0 W9 Q+ _7 m+ s. }- l6 B5 W( p
if (a) {
9 Q5 Q0 W$ A+ F: z8 l) O. F
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,- v1 d0 ?& b6 Y/ ]' w: F
e += String.fromCharCode(i);0 \: M+ d. K' v, F
e = document.createTextNode(e),( O6 F8 M* U, o7 `' M0 N
c.parentNode.replaceChild(e, c)
1 [9 K$ h- a6 v* v& l
}- S5 R, L* p! v9 n
t.parentNode.removeChild(t);
9 K4 \+ B( Q P( w5 x
}
9 h' z/ d- c' q& W6 r3 Q
} catch(u) {}6 ~# I6 ?" t3 t* j' n2 \) ^9 s6 X/ z
} ()
% r4 }) S; J6 i1 ^4 ~+ S
/* ]]> */
9 n O8 ]* F1 [5 @+ \/ X& @) P% Q
3 B' {' ~/ G0 [& g, ^. q# S
</script>
2 {. K7 C& }* \' B2 N. R4 O
<div class="nav navbar-top-links navbar-right">
6 ^- y9 m+ d; n6 [; H
<li>推广链接：</li>3 W; Y) g+ ~" G5 O! d* E2 z
m$ B# p: X! i4 b
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>4 Z) X* h J5 }8 C
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>( {/ Y/ ~5 x2 o: H
0 d* U8 W7 a; k! T+ d) f; Q
</div>* M$ u" Q2 _2 F4 r2 |- X
</body>, R, Y1 W4 f) g; H1 {7 k
</html>
2 \6 Q$ D2 Z8 x) P

复制代码

案例二：

<html>) v& `7 M, l/ K( Y( P$ g
<head>
- a( L b* B: {7 I2 V: z) D
<meta charset="UTF-8">( u. A6 T2 d4 \7 R! V l: U3 |
<meta name="viewport" content="width=device-width, initial-scale=1">0 J" n3 w5 P# y3 w' m8 R0 Z; p
<title>Zero Clipboard Test</title> V: A. T6 ?( K& d( O3 \5 e+ F
</script># u+ c% M# q( J4 ?3 F: ^
</head>
- Y' E- x0 b/ L* L8 Z
<body>2 k3 a9 Y9 h+ d4 ? G" I1 u
<script type="text/javascript"> - @. m6 M# X i4 i( Q
function jsCopy(){ $ T) F; D, @* ~5 f+ W: y# H, x
var e=document.getElementById("contents");//对象是contents
4 w0 V, s8 g- t/ C, u- R2 f
e.select(); //选择对象
6 u0 ]: r7 j* R' d6 y; f
tag=document.execCommand("Copy"); //执行浏览器复制命令
! M9 `! \ J6 _+ _0 r9 V; z' P
if(tag){6 @, A3 K( Y; \! z
alert('复制内容成功');
4 p- e- T1 w. T+ j6 a
}/ i5 D) l. ~- ]4 ^5 r$ I
} * c0 }, R4 r* G% E
2 a+ E; U z9 m& K' z$ a. M
</script>
1 F1 n) @) @6 b. c, G
<textarea id="contents" cols="40" rows="5"></textarea>
4 O1 ` {, v& B* Q9 r
<br />
; O8 z. g7 `/ x6 `' n
<input type="button" onClick="jsCopy();" value="复制" />
~8 x) \, g0 G3 c6 E8 Q
</body>' m& z8 F* `# _6 Y* ]% q$ X6 A" v3 i
</html>- z( o M) s! }7 f+ U

复制代码

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

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

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