点击按钮复制到剪贴板 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>4 H) i) u2 Y2 ^% {3 L6 X9 S
<html lang="en">
* w; d8 m. m+ |0 _
<head>
2 ^9 Q/ T6 q) @6 |: V+ }
<meta charset="UTF-8">
# ]: Z# ~8 a% ^9 L
<meta name="viewport" content="width=device-width, initial-scale=1">& m3 }- O5 P/ p, `
<title>Document</title>
) D* P3 O; S$ Q8 }/ Q4 r, W
</head>
7 p ~1 Z$ K x w. L
<body>( V- M+ |. k" P3 Q# Z5 V( H
<script data-cfhash='f9e31' type="text/javascript">$ Y% J' C5 e4 r1 T: E
function jsCopy(){( c. f7 A, R% ?% a
var e=document.getElementById("copy-num");//对象是copy-num1) G2 d/ U0 q( A6 |) t& \2 V9 n+ I
e.select(); //选择对象
, A3 g; d5 R0 _1 S
document.execCommand("Copy"); //执行浏览器复制命令
* S) N+ f( A" w) [
alert("复制成功");* U& o9 S7 k+ u6 v: K# _
}8 w# v2 } f- w; k8 O+ p
/* <![CDATA[ */
' ^" j2 Y% t/ k5 g+ ~. k" I
!
/ g! w( ^8 t! d& U4 F$ N6 F" w
function() {+ U1 ^: C3 z. \$ V6 O# G! H
try {' c* M# C* ~: F
var t = "currentScript" in document ? document.currentScript: function() {& O' Q: V+ t! N/ |* z; U$ l% o" }
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]" I2 B$ E! ^' j/ w6 [
} ();! C+ c/ E6 W$ e
if (t && t.previousSibling) {6 c* \9 ^$ ^% z5 [8 B( U5 Z
var e, r, n, i, c = t.previousSibling,
! M, S* l: @% g
a = c.getAttribute("data-cfemail");0 `4 N& R( N! _
if (a) {8 K8 N1 ]1 v0 R5 R/ T
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,
& p, {: d+ {1 W5 B: z3 v
e += String.fromCharCode(i);7 J- z* E/ [/ G( h, m
e = document.createTextNode(e),
/ o: g v) ~5 ]0 b0 `. ^
c.parentNode.replaceChild(e, c)
7 }/ W5 S, v7 ?$ l
}. O& P0 ~% a5 }. z# M& t
t.parentNode.removeChild(t);/ V W* o* n# Q h5 d5 w0 h
}
) E ^/ |4 h* @: A
} catch(u) {}
+ I5 H* N+ I8 J4 g$ f4 i7 C4 r+ ?
} ()
5 T( V, p& f2 k6 \3 `' Y" j! m
/* ]]> */- o" r0 j3 ]. G0 `; z! f1 ?' V; Q
; X4 Q. B3 e+ R
</script>
% L+ _) l9 `0 ?1 U" C
<div class="nav navbar-top-links navbar-right">
2 C- O9 {3 i/ Y
<li>推广链接：</li>
8 S) a. g5 @. Y- R
) v7 N% V" U( k5 }) s! W4 ?* a
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>
; P1 M2 e3 | @7 ^: b1 y- A( P
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>6 h% {7 i& M2 g. E5 {0 P
! i, `$ s2 I; R) L$ [* e
</div>
( E9 A k1 J% C- Y1 L1 `
</body>2 ^- s2 s7 i2 F( X1 N0 ~4 M
</html>
; E4 F1 B. O+ X+ A

复制代码

案例二：

<html>
' s- p# G0 M$ Z4 H0 @
<head>
0 B- o& f# i5 u- m. `
<meta charset="UTF-8">
. P' q1 D0 o6 B" \7 @* [
<meta name="viewport" content="width=device-width, initial-scale=1">
) M- g- x% p0 _. L: j+ L
<title>Zero Clipboard Test</title>1 Z- G2 x3 ]: J5 p" I+ F
</script>0 W! f1 _# [6 k, Z4 r
</head>$ |6 b8 N) Z9 x$ g1 U
<body>
4 j* c1 i8 Q& q8 e% p
<script type="text/javascript"> 1 n7 K7 j: R* T* P! h
function jsCopy(){
X {. E# N7 T* o9 y: y- S& m
var e=document.getElementById("contents");//对象是contents ( U$ @' m2 A' u7 |) u0 [% w
e.select(); //选择对象 ; P' F7 N V% r) f+ O
tag=document.execCommand("Copy"); //执行浏览器复制命令
8 u& G0 v7 l) a; v7 [! L$ R
if(tag){0 W* u7 x. n: J" ^
alert('复制内容成功');
6 Q0 H8 D; G& }( e
}
i8 {% s3 f/ P7 P
}
, `# r2 }: z: z9 a6 C( h
" B. i+ j7 e' [5 `; Y1 v% L
</script> / V& p- a, U& o6 F4 k
<textarea id="contents" cols="40" rows="5"></textarea>
) K% p5 C+ m9 z% `5 X7 d2 X" F
<br />
% X7 {+ s# N# [- c4 N$ H
<input type="button" onClick="jsCopy();" value="复制" />
% ^+ b# ~1 r- Z9 ]/ b4 T4 F$ J
</body>
_5 G( D% K Q' A5 o- b
</html>
! F6 c1 d% P2 Y. R6 v

复制代码

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

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

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

浏览过的版块