点击按钮复制到剪贴板 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>
! C7 \1 v/ I7 B- O$ D5 {
<html lang="en">
% g U [; V# U/ u5 m7 y. N) S. w
<head>" @, v6 A0 j1 T9 D
<meta charset="UTF-8">
! W( c U# q; J9 m ]0 E, U
<meta name="viewport" content="width=device-width, initial-scale=1">$ v: X( w& Y0 x3 }: `/ w2 L
<title>Document</title>
/ c; A# Q- t: \4 A
</head>
2 v, s$ R( \* Y0 r/ v. [4 d
<body>: f3 s6 d* d0 O3 o. H0 D8 x
<script data-cfhash='f9e31' type="text/javascript">
; K1 |6 {- V6 ]& a0 M
function jsCopy(){
8 X6 b' u( o1 R# }7 m
var e=document.getElementById("copy-num");//对象是copy-num1
0 A: |7 h. B7 O6 b8 ]
e.select(); //选择对象
5 I) C* X0 x; b
document.execCommand("Copy"); //执行浏览器复制命令. \8 [+ _3 c) X1 e: k
alert("复制成功");+ O. N, z* W5 H) S1 [- `& f- \
}8 [) Q( d( ~- ?# |
/* <![CDATA[ */
" |- [( A) Y# X3 t( K+ i
!! ~6 ^+ v" X1 U# F. m
function() {$ K0 q# a5 z& N0 i! z
try {8 z. m& R; ]4 q' W0 h
var t = "currentScript" in document ? document.currentScript: function() {+ e) o' h* L! e+ ^& K0 N
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]9 o! A# A0 v5 v3 W
} ();
, l3 V1 M9 {- z$ f% Z
if (t && t.previousSibling) {' ~% v8 v$ O+ x$ v/ l! @1 q3 |
var e, r, n, i, c = t.previousSibling,
/ u% i3 J3 \2 E- O, Z
a = c.getAttribute("data-cfemail");! ]8 _; B% Z. p% o' S8 { A
if (a) {
$ t% N8 u- v d0 k; X5 I$ d, O
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,& t0 O! c* G" R' u
e += String.fromCharCode(i);
8 {3 L7 B& r3 p; D+ i( ]0 i7 m
e = document.createTextNode(e),
. l3 p4 v& \- V$ t6 J% }9 f8 l/ X
c.parentNode.replaceChild(e, c)
' Z$ A0 k8 X$ Q* x
}5 Y3 I1 d6 K0 C8 |: D' ^) G
t.parentNode.removeChild(t);
" T2 n$ N! {1 g8 g& @0 c) E; G. ?
}
; U* H9 @8 }& s
} catch(u) {}
# w8 f4 h. `& m4 p' A" T1 |
} ()
( N/ B- D, R3 _ @
/* ]]> */
2 s9 `- F; X( j( ?
0 A$ s* [0 ~3 M/ O5 T: R# H3 T
</script>+ E( c6 `' k" O
<div class="nav navbar-top-links navbar-right">
A: k4 H* D( ?3 ]* y
<li>推广链接：</li>
* Z7 O/ }& [: ^# l1 S
3 H% G; {9 p0 R- q7 H+ Z, H5 B4 L
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>
1 K! g2 T- {/ | L8 q
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>
9 |/ I/ b* h; ?) L+ H b
7 P2 V2 ^; {$ N" X
</div>
+ k. y! ]/ g% [8 S
</body> z( W6 `2 i2 H- C& z
</html>
2 n( q9 V3 K3 }" J" r

复制代码

案例二：

<html>
2 j6 \; M7 P. M6 Q7 Z# @
<head>( y( ? ~. P9 k+ a/ W
<meta charset="UTF-8"> X( T+ R, n; A/ u% H
<meta name="viewport" content="width=device-width, initial-scale=1">
N4 D0 q# n9 K; |2 W% K, H& u! F
<title>Zero Clipboard Test</title>8 Y) E& _, Z; q! D8 c. M
</script>
. Z+ }: [/ ^: F% E6 ]7 o( l
</head>
! Q9 c0 Z' M+ p! A3 h
<body>3 y1 [5 h0 j4 D& D9 L5 `) u3 v
<script type="text/javascript">
$ `" k+ M" c7 K
function jsCopy(){
. ]. [! x7 w1 y2 p# G+ H2 j8 o) a
var e=document.getElementById("contents");//对象是contents ! R, W; S7 [ W8 ^5 |' g) ?
e.select(); //选择对象 , h1 i/ I: n2 i+ u# y9 T5 \9 Q5 L
tag=document.execCommand("Copy"); //执行浏览器复制命令
1 X% [3 s* G" `" Z3 v& i4 ^
if(tag){
1 i& X- |# ]3 }* p1 q4 N) G4 q9 Y
alert('复制内容成功');! v# ?0 d/ p9 `. U
}9 B) _( @! G6 h( [
}
% y I8 v# G4 E3 z; a; m6 c
4 W5 o: P1 o+ m1 u0 T
</script>
" k Q; q0 V T3 v6 w
<textarea id="contents" cols="40" rows="5"></textarea>7 k+ l( y. a2 `+ t' W! y
<br />
5 F/ F4 { `1 K2 z7 |" Z
<input type="button" onClick="jsCopy();" value="复制" />
' \3 W0 j7 L! T8 l: ]6 h
</body>6 O4 p+ }# n4 Q' B9 A0 u' I
</html>
) Q1 z$ @' D |2 K% V* u$ c+ v

复制代码

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

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

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