点击按钮复制到剪贴板 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>$ M5 B. z2 s' I4 r& h# D
<html lang="en">, Z3 r' C6 z- Z" V! w* M/ ?
<head>
! ~. N5 E" k9 m0 i4 d+ f9 |
<meta charset="UTF-8">
1 W$ a; a4 K$ @ _- N4 [* `% E
<meta name="viewport" content="width=device-width, initial-scale=1">5 S0 m# j* Q, i. ~+ L) X" J% f
<title>Document</title>8 J( B, b- ]& l% {: A+ O
</head>
0 P3 q7 r1 V" \% o0 `# Y
<body>, H, W1 v' m9 [+ Y0 O
<script data-cfhash='f9e31' type="text/javascript">
- t+ v, v B8 ?! Y1 L0 w
function jsCopy(){, t+ s0 Z2 v' Z. N, a% r1 }( I
var e=document.getElementById("copy-num");//对象是copy-num1) `; k: V0 b3 L, `; w) _7 }) g8 `
e.select(); //选择对象! F$ l; S0 _% ?# G0 g
document.execCommand("Copy"); //执行浏览器复制命令
a! N1 h- ^. C6 ~' C4 d% ]
alert("复制成功");
2 x1 m% e0 N; r9 @. r5 y) M. \/ b! _
}- V8 a4 Y) B% b6 _8 K5 F
/* <![CDATA[ */
9 o3 r# M% M. `+ I5 w0 d2 H
!
6 L1 G9 U8 ]# O) i7 W) g( ?0 ]
function() {# i# k$ u9 V$ R& ?4 i# g
try {
" c9 A: {+ @/ f, b3 O& q- k
var t = "currentScript" in document ? document.currentScript: function() {* r9 O+ d" n4 X8 U
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]
9 ~- q# \% @. \% F
} ();
+ K8 c$ s0 ], C$ a% S7 O
if (t && t.previousSibling) {; ?4 u9 L. L( L4 T$ ?( a6 x4 r
var e, r, n, i, c = t.previousSibling,+ X+ ~( o) V( M0 L
a = c.getAttribute("data-cfemail");( k* l) [8 r+ W) Y* j* j4 B P
if (a) {& ?6 V( m1 U) k$ J. e9 `
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,& E& y7 R4 e$ V7 x4 v6 ] I0 K+ [
e += String.fromCharCode(i);2 X% C; A# t) U+ n. g5 |
e = document.createTextNode(e),- Y( U$ `) K' V7 P
c.parentNode.replaceChild(e, c)
9 d( F% P! A; T
}
# R! I7 c" d2 z. f( S
t.parentNode.removeChild(t);
& S2 n7 I1 z$ }. E
}9 D9 b9 F' s9 D5 s4 r5 q/ y
} catch(u) {}" d" y2 [4 m7 ?9 v: h" ]8 r" x/ w
} ()
) M' V0 Q1 b, y1 B, S* m" ]
/* ]]> */- g; J- v: P+ c* U# L% h3 b
1 j q3 ^4 `- p, Q# L& }4 q# M
</script>
8 i3 S" J- V! \1 I- @
<div class="nav navbar-top-links navbar-right">
$ }' g4 |+ o6 z, w; Y1 ?
<li>推广链接：</li>
8 h3 O+ U% H/ F7 C; G9 K2 S
4 t, U, f2 t& F2 e/ t9 U0 |, V0 c9 P
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>
% M2 I- a, E( E8 c" t- C9 H
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>
( y3 f1 B, W& Q1 ?# B& q+ e3 U/ Q
. Z4 Y& L- _; K9 N' I
</div>" H& d$ c6 I" C7 _! Z6 i- c
</body>
+ l7 r9 M$ a7 g5 e
</html>4 O2 Z4 c( A$ C3 U1 ^7 A. n

复制代码

案例二：

<html>! U8 ~6 v& S7 a0 y+ o
<head>
0 ?2 E. l5 o9 ?( u
<meta charset="UTF-8">+ l* P2 N# z* N
<meta name="viewport" content="width=device-width, initial-scale=1">8 `- ^# J+ |9 w( B8 f# M4 n
<title>Zero Clipboard Test</title># F& V, w* e# L2 z! {$ i
</script>, F$ K3 K. \" T7 \' U9 j
</head>
; G2 b5 p3 U6 U3 D5 v
<body>9 f8 \. k7 L }! L& x/ m" _3 Y
<script type="text/javascript">
" R& H. P1 \" x# _2 |6 N3 ]
function jsCopy(){
0 J* j1 u) z% z# R0 A7 |
var e=document.getElementById("contents");//对象是contents
4 \1 b$ V' P: j4 _ c2 `
e.select(); //选择对象 5 P. a- f: \0 h3 u/ K0 O
tag=document.execCommand("Copy"); //执行浏览器复制命令
* o4 e; v# A% N( ^
if(tag){8 {$ L1 f! c, w, P( @6 Y7 i
alert('复制内容成功'); M. S* I5 O$ F
}4 K7 Y5 j* n5 Q% s9 C- N8 v" x
}
$ T5 U2 J6 W9 V* Z, }+ a
0 ]% D( p h e1 ~* H/ T% E
</script> 9 Z9 {3 w9 e: N1 n3 Q! t9 h9 `
<textarea id="contents" cols="40" rows="5"></textarea>( v# b, Y. e9 F# W% r' H- @
<br />
$ M! u/ S- V; c5 J. c8 C# V+ m2 a
<input type="button" onClick="jsCopy();" value="复制" />8 f5 v' L/ K# j# b) X f# [! ^
</body>8 D" _) F( |( H* u
</html>
3 T2 f5 y0 _0 S

复制代码

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

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

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