点击按钮复制到剪贴板 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 C Q" y+ N0 v
<html lang="en">/ D: R A8 z, W$ W7 h
<head>
* v* {) `5 Z$ t! |5 F( O, Q( e
<meta charset="UTF-8">2 `8 F& {8 }4 |9 b; V$ x7 L
<meta name="viewport" content="width=device-width, initial-scale=1">& K' o2 y8 F" d2 f+ j( i
<title>Document</title>
5 d- p0 H9 ~9 a( C( B
</head>& F- F& }' _4 m V# R2 ^7 O
<body>" D2 r( @( q' Z' q# l& F0 d5 I; q
<script data-cfhash='f9e31' type="text/javascript">
* g5 f% U' l' O, A8 O% K
function jsCopy(){
var e=document.getElementById("copy-num");//对象是copy-num1" f1 |" L8 T5 |" S. @/ e( u/ I
e.select(); //选择对象
' T! p4 z+ T* V, F b, m# I% X* O
document.execCommand("Copy"); //执行浏览器复制命令
) P8 K9 { r( D4 [. ^
alert("复制成功");! Q' R( Y- a1 z. c3 }
}- l$ n+ ]4 |. s- B4 i3 o0 |
/* <![CDATA[ */8 V! o, R0 p! ?; W g0 A: N! Y* w
!
0 \6 X+ E' g9 z& U
function() {
, k: n4 B" Y9 O: O7 \- B8 R) b
try {
3 P" Q: L4 a3 z4 P# l5 v
var t = "currentScript" in document ? document.currentScript: function() {
; G' k$ V; E! W+ ~) q& B: e
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]
+ L* ]' Q) ^) h, e
} ();$ k& G2 }6 {3 z# b
if (t && t.previousSibling) {
# V% Z5 S0 @, j: E1 E: M$ L
var e, r, n, i, c = t.previousSibling,( N( |; _) x& e8 [6 ~* r( N
a = c.getAttribute("data-cfemail");
0 `2 U- S1 i# F
if (a) {
) o% L; _. f" f( c& k5 u) K: F4 x
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,8 K- R1 y" H) f: j4 G0 F
e += String.fromCharCode(i);- J- B! K! e) J7 D' q8 s3 c( [
e = document.createTextNode(e),
/ h5 n5 _: j) W2 c
c.parentNode.replaceChild(e, c)
% `7 M n/ C9 p- U/ i
}+ a, d" E9 z: e! b6 Q/ `+ {
t.parentNode.removeChild(t);
: W! _+ d4 f: \5 Y6 M
}& x; U7 h8 k1 s# k
} catch(u) {}
9 }/ x0 V8 K9 W/ X- P o
} ()
1 A- ?; S5 \7 u' b
/* ]]> */
, }5 t5 ?8 \+ u
- |8 n# k: \6 `5 }- D c# ]% w
</script>
0 c" y: r* C9 z3 D' C6 j7 q
<div class="nav navbar-top-links navbar-right">: p1 R0 Z7 V" y
<li>推广链接：</li>% ^- y" a( ^! R6 }/ Z4 {
9 J% I+ v# O8 d# e
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>
" o4 g; ?% B$ y0 q. J. B8 E
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>
6 Q; P3 H U7 A$ Q" V0 ?' N0 k
' C4 r, @. ^; }, v
</div>4 v' M i6 J7 i% q* F h
</body>
8 ~) w( a& `5 r- V$ n5 p! C
</html>. G# ]7 u& s- ?: n; ^! n) l

复制代码

案例二：

<html>
9 h9 E5 _" d5 u+ S: b
<head>8 r8 H$ t% H7 R8 E3 w0 a
<meta charset="UTF-8">$ @+ f- d j' D& k1 J
<meta name="viewport" content="width=device-width, initial-scale=1">8 K3 S( }- X# y& M5 U+ J" L% C
<title>Zero Clipboard Test</title>
1 Z4 {9 ~8 ^0 I* Y
</script>( w7 U" p$ Z! Q
</head>) k6 d. V2 X3 F
<body>
$ ]6 u8 T3 v: I+ ^$ a ^! O
<script type="text/javascript">
6 [% A Y8 O N& w7 e; L$ m
function jsCopy(){
7 R0 t: T1 u4 u) X5 k
var e=document.getElementById("contents");//对象是contents 2 T# e) t2 T8 B0 p' y( z- F: h
e.select(); //选择对象 / }* E. w" p( w/ O
tag=document.execCommand("Copy"); //执行浏览器复制命令6 p% o8 Y3 W6 {0 q X" [6 v3 u
if(tag){
" `7 W; F* y0 z
alert('复制内容成功');
7 w% l/ s6 V6 p# u, M! e% S
}
; G$ K% J$ H8 F) K- e) q
}
B) C+ G/ S0 F O
* q# W$ E& O9 Y
</script>
7 J" V, N& k! @# L( f
<textarea id="contents" cols="40" rows="5"></textarea>
0 Y# V, I7 p5 K N, i* O" p
<br />. C# Z& a# I5 ?' d
<input type="button" onClick="jsCopy();" value="复制" />2 z% }% n- H' v4 M& S# e! F" W
</body>) E4 ]1 ]# ^, L3 t
</html>
# Y5 ]0 j8 d9 }+ _6 X2 _

复制代码

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

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

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