点击按钮复制到剪贴板 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>
4 ~% g1 Z+ F4 e x }4 f
<html lang="en">
" ~1 P. G3 t% L. G, u/ j6 F7 X
<head>
( P: c2 e8 a Q* [ G
<meta charset="UTF-8">/ k$ L. w" C6 V/ S; S) @
<meta name="viewport" content="width=device-width, initial-scale=1">
, f0 P5 B# p3 f/ s ^* `
<title>Document</title>
; x! [8 Z; z9 H, W2 G" \) [
</head>" R0 |+ l- W7 I- b3 j2 a
<body>
2 P' H% F4 H `3 \ X" ^) e
<script data-cfhash='f9e31' type="text/javascript">1 _$ J" r5 j! ^0 x
function jsCopy(){
$ C1 J9 C- B% P
var e=document.getElementById("copy-num");//对象是copy-num1
% t; M& O% b9 h5 {7 { k
e.select(); //选择对象
5 \) U9 P& p' z$ e% c& ?* n, D: r
document.execCommand("Copy"); //执行浏览器复制命令! q6 k8 f7 h6 N7 @
alert("复制成功");5 _) t. e' T* v/ X
}/ K. \- }2 P: [- J, H) b, q
/* <![CDATA[ */
0 @, B7 a0 U7 g" e" t
!
% }) Z- [8 _( J# [) J
function() {
; W2 c. K! N8 m' R3 X, Y8 t
try {
% p( S( k/ X9 O4 }6 Q
var t = "currentScript" in document ? document.currentScript: function() {9 d* G+ Z+ U9 j1 L9 r. g
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]& ^ q& w: E/ { f6 q* c% g
} ();" w+ p& Z$ o2 B) N
if (t && t.previousSibling) {% |: i! m$ j# E& N
var e, r, n, i, c = t.previousSibling,
0 F8 R$ W" H4 D5 D0 N
a = c.getAttribute("data-cfemail");
+ ^- Z% }9 ]; y* o
if (a) {0 m3 l1 |/ o! S* n s4 g
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,
" A( l5 Q0 d- `9 F: D
e += String.fromCharCode(i);/ A4 O, v( o; Q# V1 R5 }
e = document.createTextNode(e),
; T" t6 x5 m" S7 o1 W1 U
c.parentNode.replaceChild(e, c)
$ |( n: H7 u. ~. p m4 |
}7 D8 W- r- X6 D; b0 A+ J; L
t.parentNode.removeChild(t);
9 Q$ \4 r/ o( _( H" r
}5 L. h( f' [5 R
} catch(u) {}
3 d5 W( z: ]7 |) R. X
} ()! A, v+ l0 i F+ s
/* ]]> */
# v' v3 h$ ~; ~" \1 I6 ] O( q
6 n6 b# ^3 ?0 J% O4 ~
</script>
% ], }3 z% o( t6 ^# [
<div class="nav navbar-top-links navbar-right">( [- ?; P/ ?% B( X) Q; A
<li>推广链接：</li>
4 s: P& Z; c" g/ p- K
8 k! t. R a7 R
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>
5 i V& M) W) ~ i r5 ^
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>
# t! ]* e1 P4 e: a8 Y& |% f8 x# a) d
& \3 V. q. C$ s' B" ~
</div>
, `" c2 w4 l' j: J
</body>
8 k$ s6 B9 I; j# @; Z
</html>0 h7 u d! E/ Z" e8 o( V4 F6 r6 r

复制代码

案例二：

<html>
+ J) ^7 p+ N# F# g
<head>
* p' [. N( w; g: D' U, q7 }$ f
<meta charset="UTF-8">7 h# N7 J3 }" q: _' O9 ~$ ]
<meta name="viewport" content="width=device-width, initial-scale=1">& B/ W& S; {) M0 t. J$ Z
<title>Zero Clipboard Test</title>) Y1 D0 P* N e( I2 C2 L
</script>2 [' X+ q) N1 I" w' A# t
</head>" J M+ _% N9 ~0 S4 f
<body>+ C! j5 \0 N9 }+ C( L
<script type="text/javascript">
1 I4 j4 _8 y. V; c6 |, A, f
function jsCopy(){
, N7 H) m, p5 I9 c
var e=document.getElementById("contents");//对象是contents ' o) E! @& ^0 B5 V
e.select(); //选择对象 ' o& O$ m" G% m4 B# L" P: p1 f
tag=document.execCommand("Copy"); //执行浏览器复制命令9 c) h) |0 r$ j; \+ m; u
if(tag){
1 b- J. @2 u% {7 y' o: u1 Q) P- ?
alert('复制内容成功');
; S% w, w9 d% T% t9 k
}
) c9 ], C: k4 C9 A4 P( a! A, W
}
; v: O: P0 ]' h" ?. N" p7 S
j3 M/ A c8 b, h- Q9 _3 x0 O
</script> $ l0 T) d8 S2 p7 _' a. q; R
<textarea id="contents" cols="40" rows="5"></textarea>
3 Y' e+ b3 n/ W4 t; `, J1 X1 U
<br />
4 }/ i$ ]( ~4 ?/ G5 n! @; C8 d
<input type="button" onClick="jsCopy();" value="复制" />3 g2 k9 G/ l' @( p0 B5 a, c
</body>) |8 u8 D7 \$ r3 r o9 y
</html>* {; S' E! N9 Z% F* i% O

复制代码

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

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

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