点击按钮复制到剪贴板 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>
# _. U; j* P- Q( q
<html lang="en">
* L! k1 \' Z9 f9 a- U( D6 y- n6 _
<head>
4 G: D7 w* S5 H" J9 S- x9 B9 m+ j" c
<meta charset="UTF-8">
9 Y/ L- X7 D+ ^ r2 Y/ }
<meta name="viewport" content="width=device-width, initial-scale=1">
: K- n3 q1 j( N) c& v( X
<title>Document</title>+ Y* h1 [# |0 V7 }+ M7 l
</head>) ]2 ]* D$ z: o
<body>/ i. G5 R' j- P9 o, W
<script data-cfhash='f9e31' type="text/javascript">
) L" S! m* m# m9 W3 K
function jsCopy(){3 K$ |) \) {% m% K; ^! T: M
var e=document.getElementById("copy-num");//对象是copy-num1* T+ j. @" b$ h4 h
e.select(); //选择对象
% \' d" i; K G+ C: V8 Q7 H) d6 Z' B
document.execCommand("Copy"); //执行浏览器复制命令
( G. }# I4 i3 g7 h( ?, d5 r
alert("复制成功");3 q, K8 U: f9 ]6 p* A
}
4 |. I- z0 C3 P4 n, {( C
/* <![CDATA[ */8 V; o7 a. V$ f9 q- U( F$ E1 m
!
% |4 i; U0 ]2 d1 ~4 G
function() {4 g; N% i' [' l( L% d2 ^& O1 x& S' z% |/ P
try {
' }' q2 E% g& \" V! K
var t = "currentScript" in document ? document.currentScript: function() {
+ Y6 M2 i( H+ l; d. d
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]
0 X5 Z" M5 O) T1 |6 m& p5 k2 U
} ();
+ T1 p: B6 |; _) Z, E6 t
if (t && t.previousSibling) {
6 T0 Z4 o; I* ^9 R& U( s
var e, r, n, i, c = t.previousSibling,; H% m3 B2 C, M, X5 g9 B
a = c.getAttribute("data-cfemail");
& L1 O$ c# q7 D" R5 M- M
if (a) {
) k7 Q, L3 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,( o$ V6 q! q; P; I
e += String.fromCharCode(i);
# Z. R; |0 X, N8 \0 l7 ~
e = document.createTextNode(e),
+ f8 @: ]9 s0 V' _" `& B; p" R) B
c.parentNode.replaceChild(e, c)% r4 I0 Z! F) b, p9 I" `+ o
}/ f' z% v4 k1 D% u! _
t.parentNode.removeChild(t);4 Q. l: ^- d$ _( F$ X* X
}
: S1 m0 r# N! l) x% ]8 g0 l
} catch(u) {}
- a. ^! W& F0 w7 S! z
} ()
$ [ j/ _' e4 e$ U
/* ]]> */
( Q+ n/ z. \: k3 h7 o4 ]
1 r3 j; y3 I. `
</script>
! h( E) [9 c$ d. V
<div class="nav navbar-top-links navbar-right">
3 B1 T) W2 M ] b( o
<li>推广链接：</li>
, f2 P3 P* i. s' _7 R
' _* \' I3 b6 W2 T }
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>
& U z( e: [& z+ S/ g1 a& h+ |
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>5 k% I2 u2 L0 {; ?7 V4 j+ J
w, p9 e- N3 i' G6 O
</div>
0 d' d5 [" S0 e( s: t' [4 i
</body>
* x- x, j( C$ j
</html>
! _; R% ?+ X% x8 E: G

复制代码

案例二：

<html>
- F1 B& N/ c s6 g- k( \
<head>
, F8 {8 G) P, y3 Y+ G& S; C
<meta charset="UTF-8">; A* W- s; ~( T9 ]
<meta name="viewport" content="width=device-width, initial-scale=1">* T$ s3 H5 q3 l4 V& j8 u
<title>Zero Clipboard Test</title># O6 S6 w) t# z
</script>' ] t3 t8 q5 ^# p0 A
</head>
2 G- T. {! y4 f! k$ f
<body>
% N; g" d8 W# a- |2 ]& `
<script type="text/javascript"> / Q; ?$ f, L. G5 r
function jsCopy(){
3 I, Y6 V. T" I1 p
var e=document.getElementById("contents");//对象是contents
9 R" o5 W8 B2 r( M
e.select(); //选择对象 " e y! [$ K* I0 h2 `
tag=document.execCommand("Copy"); //执行浏览器复制命令
; W p. X. W! k+ q# y7 ?
if(tag){
( Y1 _3 P8 a" F' A1 `8 A* |
alert('复制内容成功');
: B- s$ A6 _) h' s
}
$ I/ P/ a0 a# ?9 \& v2 W* |+ M* l
}
! Z+ m: i& L5 `8 r7 i
0 x6 g9 L& x( u! ?; B* ?8 g
</script>
, v0 o6 I/ X3 H$ D" c+ j; h8 T
<textarea id="contents" cols="40" rows="5"></textarea>6 ?) [$ w5 T K' G# D# c
<br />
* U" w4 @# B6 o3 y: Y) l
<input type="button" onClick="jsCopy();" value="复制" />
/ l) C& o7 E. ~: @
</body>4 \" V" o1 b# E
</html>8 `2 q) Y6 C, x8 }) U; @

复制代码

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

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

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