点击按钮复制到剪贴板 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>
# D9 T6 I* y& |" q. A% _" _5 H2 W
<html lang="en">2 Z$ ?- U/ M, w* |5 ~
<head>" S1 p: G. a" B) p0 Y
<meta charset="UTF-8">
' y8 @) \& k0 z" V& `2 R
<meta name="viewport" content="width=device-width, initial-scale=1">
}3 W; e; @+ o" S ?1 \
<title>Document</title>
, k- Z3 D4 W7 v5 O
</head>
: ?/ |# m; T2 \+ N- b
<body>
6 f5 y9 p" l7 S
<script data-cfhash='f9e31' type="text/javascript">
1 s# W7 }% z0 X" I0 O. y
function jsCopy(){6 T* O( S& H* c. X8 O( D
var e=document.getElementById("copy-num");//对象是copy-num1# [& r9 g4 d' S/ z; i0 w
e.select(); //选择对象2 J, ?3 [ x$ W: B# h! v
document.execCommand("Copy"); //执行浏览器复制命令
) @. f2 o8 a! @
alert("复制成功");+ P* B3 R0 x& k6 H1 @' l* l
}4 w+ q- }# a( X2 ^' \) Q! E
/* <![CDATA[ */0 @# a \ b' P& j
!* o7 r- k, G, y+ C; ^5 K
function() {
try {
/ ?& \2 x1 W' ? `
var t = "currentScript" in document ? document.currentScript: function() {# |8 I; t, B2 Q! y3 B- q) E# J
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]1 ]3 k+ B S: g' M- m
} ();
; d8 J3 {) R9 {- g S; L
if (t && t.previousSibling) {
# R+ [! R" _1 h' {& F
var e, r, n, i, c = t.previousSibling,
! \9 j5 n3 t6 D. V
a = c.getAttribute("data-cfemail");3 n R" x6 g( M J
if (a) {. J2 d0 f, G. Y5 G1 k
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,
6 c/ o. L; h; n# \, k/ Q g
e += String.fromCharCode(i);2 a: O' A& e$ j$ h. N. @
e = document.createTextNode(e),2 u& u* r, L5 S8 O
c.parentNode.replaceChild(e, c)
1 f! I% g+ D2 g
}
! V3 i4 E+ l+ A( q1 I9 T# ~- h
t.parentNode.removeChild(t);
! X6 m& T8 V6 `6 Q+ e6 S9 @1 ~& C0 v
}
9 o, V4 H: u- J
} catch(u) {}. k6 v3 `$ Z' U- ~
} ()& O. r+ [2 b. B3 c
/* ]]> */: ^$ r) n$ C/ q% `5 x) j
# e2 V+ A- c! {
</script>
/ b# E$ f9 y2 H5 P( r( ]6 p0 |! I
<div class="nav navbar-top-links navbar-right">
0 T% M, m. f- X6 s+ \! T7 w" Z
<li>推广链接：</li>
" m! |6 i9 m; e) R; j
& b% ~! @' j- }$ c9 x
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>
c) M7 Y$ `9 b: p
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>8 ?' ?5 t& L3 ^$ I% `* `
5 `) B5 J, `, j7 D# T
</div>
) U0 Z! u; O) O" z5 J, ~; y: f
</body>5 U6 s" V1 k9 X: }1 s' t/ D
</html>
8 `' a0 s% i" ]! Z+ ^& z' i

复制代码

案例二：

<html>& Q; c; r6 k8 e/ q
<head>' O$ u5 [6 l4 O. ]3 B' ?8 }/ w
<meta charset="UTF-8">+ F' D2 P3 w- \/ S/ C8 q" \
<meta name="viewport" content="width=device-width, initial-scale=1">- n! N" ^/ r$ n& a/ U; q
<title>Zero Clipboard Test</title>5 g! c8 Q# U( y
</script>8 G8 r6 D) s2 a# f1 N7 C5 |' R8 K
</head>5 v; L# A1 q; b: ?2 g0 {% P7 E
<body>9 c5 r0 t0 D' R; |* p: S R. C# a
<script type="text/javascript">
# E& Z' G2 c) Y$ u5 N6 B
function jsCopy(){ 2 e @6 x' f7 F" O: @, Z
var e=document.getElementById("contents");//对象是contents 0 l' y) r- f# d
e.select(); //选择对象 ! [, X0 s& A, ^' D# f5 g
tag=document.execCommand("Copy"); //执行浏览器复制命令* x, M v6 B) M9 R
if(tag){
2 y+ R% J- k& o- a
alert('复制内容成功');
2 u* ~+ w. z8 b
}% @% M8 N0 W% ?4 D, k
}
* y0 w6 ^3 R! }! @% w
6 u( S; z0 z6 \) O) g2 e
</script> ' o/ k6 X, M+ B$ G, `, k
<textarea id="contents" cols="40" rows="5"></textarea>
% L0 }' @, H0 v
<br />
/ x, Q% u" O4 o" G1 M) l
<input type="button" onClick="jsCopy();" value="复制" />
+ G) Y! _0 Z) d/ Q( `
</body>
9 m* W* d# A# J9 l$ k( `
</html>5 p+ t) ~8 Y' u* z# O# P' X

复制代码

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

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

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

浏览过的版块