点击按钮复制到剪贴板 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>3 C7 v/ z- @- s
<html lang="en">
' S7 E+ W% ^+ g( u
<head>; v# f- @* j4 x- d' n. J
<meta charset="UTF-8">
& L4 J5 p. A- j+ G0 E
<meta name="viewport" content="width=device-width, initial-scale=1">) a/ H3 V# H9 Q+ y* v8 ~0 S& g1 V
<title>Document</title>! Y- w; k$ X2 R. q
</head>
r4 C, z( j3 J+ h; S; e
<body>% F* g+ V# n' s; [ k! P; b6 k
<script data-cfhash='f9e31' type="text/javascript">
7 h& l: i& X2 I* O
function jsCopy(){
" S* }9 l/ m4 i$ r7 n0 D a
var e=document.getElementById("copy-num");//对象是copy-num14 y8 u7 O$ A; @! s" B, @. \7 L
e.select(); //选择对象
0 ^8 ] j& d& a; I0 D
document.execCommand("Copy"); //执行浏览器复制命令' z8 o* G/ w4 D3 U; H
alert("复制成功");% B; b# t1 V3 A) r3 b+ a6 _+ f9 {
}
# r" ?* M7 u" x% e$ [& E* i
/* <![CDATA[ */; E. c8 C1 [' T- @ h8 Q
!
8 o; i9 v: M2 _6 o0 c+ c5 `/ n
function() {
0 T4 K( {% _$ o" p1 U
try {2 ~- v. I6 }7 F( |% }. }( J
var t = "currentScript" in document ? document.currentScript: function() {; ~* R. G! h4 [9 \- g8 j
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]
$ g6 R$ K2 J: M2 T' X$ X
} ();
! O: K5 I' ~9 C1 z- ?- I6 T
if (t && t.previousSibling) {0 K7 |8 a7 A6 ?* \, R3 x' p( n5 Y
var e, r, n, i, c = t.previousSibling,
6 B6 o/ H+ }" E& a# e
a = c.getAttribute("data-cfemail");5 {0 G% e( P+ ^$ u0 M# A
if (a) {
: w5 K) r- m$ a0 `8 _
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,$ L5 G' q: o( m1 l8 N; D6 H
e += String.fromCharCode(i);
- Z! h+ d% h5 G" `& J
e = document.createTextNode(e),
0 L7 N+ W0 ?6 D" S/ k, M. `- A
c.parentNode.replaceChild(e, c)3 p9 m" N4 L/ I9 ]1 `/ n+ T
}
& }1 m) _. t3 v$ |( @5 u
t.parentNode.removeChild(t);1 ~8 |& v( Q$ H. d. l9 T8 n
}
- i5 T- Y4 ] k* `7 ^3 N4 L
} catch(u) {}
2 R# W' T) ^, z4 N0 W
} ()
; P- X7 }9 a2 W
/* ]]> */
! M5 T9 X, {/ h) q
/ _7 K8 M, r: Z6 J# @
</script>
) P) J9 \. ] U1 y, A
<div class="nav navbar-top-links navbar-right">5 s' X k2 [8 w, |' u" x7 `. u
<li>推广链接：</li>
+ J" v4 U: G: c( s9 ]$ c
; j) B1 X+ O, W+ t' U
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>7 U# o* G! |, {2 \
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>/ @! m7 I& k/ Q7 T4 m! E
! i2 X* z! w% [$ a5 g' e
</div>
$ r0 [% o" }& H8 N
</body>
6 e0 v& X% T# L
</html>
) m0 S/ q- z6 l; a" n

复制代码

案例二：

<html>: [2 u. R3 q- Z( z. m) n
<head>
5 X% d0 `3 g8 q- N
<meta charset="UTF-8">; R/ o7 N/ G+ Y! F7 N
<meta name="viewport" content="width=device-width, initial-scale=1">
+ L; T8 @: q! c0 D$ e4 S
<title>Zero Clipboard Test</title>
3 ^/ \" V0 v) Q) {6 ]- C
</script>
I0 S' Q/ g8 m; g
</head>
! i' P/ M- \' X9 A& @6 e' {
<body>* N7 E8 X3 p5 _4 H: d. F$ h
<script type="text/javascript">
/ [) L: b/ i2 Z: o! m
function jsCopy(){ # `) z( u! Y* R5 a$ }* @2 C' d
var e=document.getElementById("contents");//对象是contents
2 H2 B9 f0 ?% Q* i2 ?
e.select(); //选择对象
tag=document.execCommand("Copy"); //执行浏览器复制命令8 D- w) a3 F4 N2 V5 B
if(tag){* U3 P) W* `8 ~; a& p" w/ y
alert('复制内容成功');
' f) }, P8 l+ A" C1 ?4 w
}, f x( P. t* b
} `+ k. W3 V, s6 Y7 o/ W- | p8 n; `( Z
' P* X5 Y) v, Z
</script> 7 v$ O. h# u2 v, Y1 X7 D9 K
<textarea id="contents" cols="40" rows="5"></textarea>; u5 J6 Z' |& E
<br />, B6 U! G: Q/ [+ g
<input type="button" onClick="jsCopy();" value="复制" />
! H, K: b# j1 S& i$ E. l
</body>3 k' e2 h) R; o3 y4 |
</html>
6 [$ J2 d6 k: _0 T

复制代码

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

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

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

浏览过的版块