点击按钮复制到剪贴板 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>
6 u) c; r: R G6 g$ b6 P
<html lang="en">
; d8 D% Z- _5 | A+ w
<head>4 R0 p' Y* p0 l! t& E" D' s, @
<meta charset="UTF-8">0 l* w) S- F! `+ K. \5 E4 D
<meta name="viewport" content="width=device-width, initial-scale=1">
2 N" S- r; ^* F4 q% X7 [: @
<title>Document</title>
1 a; j; C! Z$ O% Z' R
</head>1 B+ L, u( w# s* ~# s( r- D
<body>
* L$ C. m& C( p
<script data-cfhash='f9e31' type="text/javascript">0 E/ j* H9 x2 ]7 F0 j
function jsCopy(){. q4 \5 v6 S' N8 J
var e=document.getElementById("copy-num");//对象是copy-num1
& @: s! t, k' m" K' A! F' ^2 V" w s
e.select(); //选择对象6 q5 I( O3 k9 E) U3 b
document.execCommand("Copy"); //执行浏览器复制命令
9 u O5 d9 |1 O! R$ V8 A, d
alert("复制成功");
) r8 r" P. I8 P7 W" b+ ~
}2 N! z4 M+ G9 M; l$ q+ B( ]. l
/* <![CDATA[ *// S }8 j$ w1 l( n1 N. H7 W
! \5 I" X" ?9 C5 z& L" u
function() {9 N- O* ]2 y6 P' p Z
try { ^" z- h; M ~* s: e
var t = "currentScript" in document ? document.currentScript: function() {" c4 } ]% S5 g( \5 R: G$ W9 ]) g4 X' M
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]3 O; m. s/ j/ W% M% Q- r
} ();5 X/ G1 ~9 v# }; d4 w, f' z' O& Q
if (t && t.previousSibling) {4 l, Z7 b6 X& V+ u% V, }
var e, r, n, i, c = t.previousSibling,
* }7 g' J. Y7 L5 Y) j' f3 }! p* L3 \
a = c.getAttribute("data-cfemail");
" {6 w: i- y- M. [2 \: |. j
if (a) {
, p& l8 S# C1 R/ d8 E" t7 I1 w
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,( u; C' [, Z5 J$ j" m! y. S
e += String.fromCharCode(i);$ q1 P7 e$ u1 `% Y" z- ~# J
e = document.createTextNode(e),( m& P9 J/ N$ \# C6 v
c.parentNode.replaceChild(e, c)& \; f" Q: [/ w
}% H, F6 q! R/ o R6 ~
t.parentNode.removeChild(t);
1 f- Z! o9 s U0 d4 o* E
}
0 s6 d/ i5 T& w# ^- |4 d* {8 ?
} catch(u) {}6 v5 c* m. I X+ X9 r) Z
} ()
% Q7 `: y# a) M0 {) H9 `
/* ]]> */
$ H: W7 K$ T$ W3 }9 B
3 J" H( h+ o- ?4 L% S: K
</script>
* o4 \6 P+ B" I
<div class="nav navbar-top-links navbar-right">0 G0 C9 h* j) ^8 h
<li>推广链接：</li>* B, J' [, k- k. R" l( H4 ~9 L4 E
- Z+ B! r2 U/ y* i) X
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>
( {6 i* E. T. r" h/ h, {# |2 J% u; ^
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>
9 A! L [) H. e r) `# F
/ ?, d& u, @+ G" [1 y* V- l0 B
</div>7 B& C2 _; M% _+ @5 D
</body>$ r1 U, K/ _! d' i! G0 h. M
</html>
2 n; w& _' J7 h3 [( M

复制代码

案例二：

<html>
: j I0 d( O4 F6 H/ T
<head>
1 a( s& |* N2 M0 `
<meta charset="UTF-8">3 V8 K9 {4 B A/ q0 B5 c9 V3 }
<meta name="viewport" content="width=device-width, initial-scale=1">
7 i# q5 p( N5 g/ p$ B8 O. D+ m- i" r
<title>Zero Clipboard Test</title>/ D# O+ @5 ^, E' c
</script>- t; f' r8 T' m2 j0 U5 a
</head>
( g# O7 n2 s2 _/ `8 T0 S
<body>) ]% q) G4 G8 ~2 |4 p* F
<script type="text/javascript"> " ~# Q. R" `# d" }
function jsCopy(){ 7 C" o1 ^/ _* d! V8 L5 Q J
var e=document.getElementById("contents");//对象是contents
e.select(); //选择对象
* {* K" t2 S4 t. }. J( e4 h7 n
tag=document.execCommand("Copy"); //执行浏览器复制命令
! }* d8 P3 X: {$ N/ n1 H
if(tag){0 q, T8 ?7 N( `& d, q
alert('复制内容成功');
`% \3 h# W5 A1 d' o8 w! h
}- f- H. f& Y0 c
}
! ?6 i3 Y$ M3 p% y ?7 O
4 ?8 } U4 G# |5 g, M3 g: J; o7 k/ }- o
</script> # a, t& t) g5 p+ Y. }" U
<textarea id="contents" cols="40" rows="5"></textarea>; }- U' p' J% N# n, h
<br />8 j( z+ l s0 c2 _$ K
<input type="button" onClick="jsCopy();" value="复制" />
3 k* {* v2 M! x" @) n
</body>
0 N6 C" g' s* i [1 k3 S% ~
</html>
! p0 p- Q1 |7 G! ]# R5 `' g

复制代码

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

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

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