点击按钮复制到剪贴板 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>
" I! f9 a9 d& u L+ X4 q
<html lang="en">: M* F. X s& s! c1 \3 ?1 X
<head>
" B# A0 q! ~* H0 { G2 ~0 B* x" r
<meta charset="UTF-8">
1 q( b: ^2 e+ ~; p
<meta name="viewport" content="width=device-width, initial-scale=1">
. y( f& W/ w$ t9 T9 t4 o8 o2 C
<title>Document</title>
3 {* m0 `# K. f U1 c* K: D
</head>9 Q' E$ s& M) `; d
<body>' U0 p6 n- R q. e/ x6 t
<script data-cfhash='f9e31' type="text/javascript">
7 p& }' ^9 o6 Y; X
function jsCopy(){( j. ], i# I* _5 M. Z1 C- y3 F8 Q8 d
var e=document.getElementById("copy-num");//对象是copy-num1' D% Q& f+ p& R
e.select(); //选择对象& e9 f+ B T) I7 T3 s
document.execCommand("Copy"); //执行浏览器复制命令
- E3 Q- l7 r% D4 H9 D
alert("复制成功");
" ?1 g1 G" b8 e! r9 e/ w3 g" }
}
d% u9 j9 M3 w* D8 I/ F; Y
/* <![CDATA[ */1 ^ A! D1 p6 C( Z0 |2 h$ Z
!
' A3 q. M& H* I3 W
function() {, ?+ P/ _5 b+ \3 X/ Z9 b
try {: T3 o( _- ?- z5 q& W! \. x. b
var t = "currentScript" in document ? document.currentScript: function() {
; j0 p, v' L+ w0 R' L
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]
7 _% X$ e; X( Z5 v. U
} ();
/ l' D: H5 N# U0 h
if (t && t.previousSibling) {
% ^5 r" p' k2 C. J; s D4 G
var e, r, n, i, c = t.previousSibling,% C- A! ~4 `3 y& s7 ?- V2 ^$ f6 u. b
a = c.getAttribute("data-cfemail");
5 o# i5 Q# M7 [+ |+ W, ]$ o
if (a) {
: Z* W0 K6 i% k, l9 `7 F8 a$ D
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,& p$ x F }; Y w0 [8 f, s! E
e += String.fromCharCode(i);
5 A! W' n7 P+ M
e = document.createTextNode(e),
- u# I+ @- U- c+ o' u! L& Z
c.parentNode.replaceChild(e, c)
( f |! u, O/ q
}
9 L3 u" L! \3 N
t.parentNode.removeChild(t);8 f! X8 ^ E( h4 U4 o
}
; Q6 O0 {) B1 I4 ~* l) U' k/ h
} catch(u) {}
/ A1 R8 U2 s' P0 |4 l$ U
} ()! Y( |4 `4 B% t. `7 T Q! m
/* ]]> */! L0 n8 N) _! m* J. M" G; W1 z( A
" Y8 B8 O0 c& ~1 x" p, t" L
</script>
- w) B. O# r1 E4 V r K. J
<div class="nav navbar-top-links navbar-right">* e/ x; w" `( A4 ^- c
<li>推广链接：</li>% R& F# D5 z" x( c# b! l
4 s$ ]: n' R3 q
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>
# L; M( L. ?, @$ N2 ?
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>
6 {& g2 J0 x* i- e) H5 O
+ w# i m/ V4 i# S- F# a5 C
</div>
4 O. l. p+ E$ Z3 h6 ]1 N
</body> F! n7 P1 U& Q0 ~7 M
</html>
& A9 i6 F' r, W6 ^! P2 [3 M9 F) Z$ k

复制代码

案例二：

<html>- \0 {2 R) g" Z5 l2 R7 I
<head>
; w# n5 s; q+ i- U
<meta charset="UTF-8">
- k ~% X8 W/ G0 {- S, |
<meta name="viewport" content="width=device-width, initial-scale=1">/ ^; r# i5 p) O/ s- k
<title>Zero Clipboard Test</title> t, v) G- V+ K& T4 k
</script>8 v5 O) Y- h1 ^" c9 F+ b: k- B4 h
</head>- \+ C. c- M2 M$ d: m1 A
<body>- F9 U& ^1 k! C Z) v2 f
<script type="text/javascript"> * g# r+ O5 P F) [! |& P
function jsCopy(){ 7 E1 H8 x0 \1 B' r- f" h" K# V: i& \
var e=document.getElementById("contents");//对象是contents
1 Q& {* [& P: F3 j
e.select(); //选择对象 + x V, }+ c: I* X) b
tag=document.execCommand("Copy"); //执行浏览器复制命令
7 l* I1 \0 _) }( D4 _
if(tag){% a9 k; g$ K0 b% a$ L
alert('复制内容成功');
% `; C) B z2 C* v" O
}
! c) s, r1 i) t% s- @5 W0 W
}
9 C6 c: j$ l3 c7 O$ W3 |' m# B
6 o3 {. P8 B+ z/ B [2 T3 r
</script> ; h& N% w( H; g& @! b& w/ M3 s
<textarea id="contents" cols="40" rows="5"></textarea>1 o, u$ \8 R- V9 b1 d& M- W
<br />+ `, p# N% }8 A& S M3 V' R' L1 F+ f
<input type="button" onClick="jsCopy();" value="复制" />
; L7 }: b4 y4 p& o' C; h7 {/ V3 h
</body>
' E& ]3 V- z; A6 S+ y# D
</html>. h1 c9 m/ \+ R

复制代码

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

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

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