点击按钮复制到剪贴板 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>) E1 ?# D0 |4 J' A: J
<html lang="en">
' j; F& y4 B2 O& h/ t1 H3 p
<head>6 z: `+ {4 C% Z7 t, s
<meta charset="UTF-8">- c( }# e4 {0 F' e0 W K3 c7 |7 K% q
<meta name="viewport" content="width=device-width, initial-scale=1">
# @/ O, b+ p2 I1 [! N
<title>Document</title>
A$ P3 h0 J1 `# H/ M6 P, z' K3 ?
</head>
6 N9 A7 E7 v! y- n. [6 |1 g
<body>
7 A) L# R( E+ |
<script data-cfhash='f9e31' type="text/javascript">' S$ A3 R/ ?' D2 t
function jsCopy(){
, T+ i4 ]. K1 m" V y" ^: h; y
var e=document.getElementById("copy-num");//对象是copy-num14 p2 p, T: Q2 t Z2 G/ `
e.select(); //选择对象
1 i% s1 ^8 L+ ~! H
document.execCommand("Copy"); //执行浏览器复制命令
* {) H1 M9 H: k
alert("复制成功");: ~: [% c% i& a
}' G& D! l9 z4 g5 l9 `! ~: U
/* <![CDATA[ */& s3 y$ \/ \2 {! D: y* F! @
!+ G. Z* g/ T0 J1 T7 `
function() {7 G8 n, o; ?- ]& C7 C
try {
6 H, @& J2 U+ `! f0 y
var t = "currentScript" in document ? document.currentScript: function() {+ H* n6 J& b y! a! f
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]: T* o4 \0 [$ J
} ();/ R7 `: h3 n+ C% m4 y* S
if (t && t.previousSibling) {7 K3 o& n* l: Z0 v
var e, r, n, i, c = t.previousSibling,
- p* M/ e3 u) ?$ U; d. y/ v
a = c.getAttribute("data-cfemail");
* r# ]$ j ]" e, X6 f# M8 B& E: _! |
if (a) {
* x, J# x( C$ f! W$ a3 ^
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,
e += String.fromCharCode(i);( C& V6 P* v7 v4 c7 Y
e = document.createTextNode(e),
: L6 d/ I9 K5 }. v9 Q$ ~
c.parentNode.replaceChild(e, c)4 Y' c8 o4 T4 [0 k6 V
}# v4 W- a% s ~& f4 X
t.parentNode.removeChild(t);
! T; h; @$ J; u5 x) {9 c2 H
}
( q$ W" J& l3 ?! Q" \4 s9 h
} catch(u) {}+ Y* F9 ~$ `8 k& `4 `
} ()! L' m3 `: x/ [' Z) b3 h
/* ]]> */9 M/ M# |* O! B2 d; h
" P3 I$ b! T( K" y4 a0 ]+ [
</script>1 N' x7 i+ S+ f* S
<div class="nav navbar-top-links navbar-right">7 H' `) z9 C8 N( T
<li>推广链接：</li>
7 l/ n) D- i$ h" n8 L9 |3 d: |2 C
! y% Z: b! w2 B" y
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>/ e$ d9 y- T/ Y4 N2 m0 y
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>
, {: _+ m+ L3 S2 D( c8 s; `
2 _. f/ N# y9 n
</div>
( I% i, O' Z2 S! v! ^
</body># u1 K5 p% r Y: D$ k6 H, {3 D( I
</html>
, H3 s/ V, B5 X5 }( u% M- D

复制代码

案例二：

<html>' S" V& j% L+ m4 c
<head>( k8 Q5 n, D3 T1 A, B' V8 f
<meta charset="UTF-8">& A# y" u) B- E9 j2 P' z
<meta name="viewport" content="width=device-width, initial-scale=1">
# x' l7 a. c! y6 B+ ]
<title>Zero Clipboard Test</title>- P+ v3 I: ~' ]
</script>$ T6 o9 b8 B" Q
</head>- N( J4 {+ `2 R" p' n% U5 S
<body>- p* W& k+ @- a" K6 b$ m/ q4 Y/ B
<script type="text/javascript">
' |5 Q! t; Q! K* A8 G
function jsCopy(){
' ?0 @. _4 S1 F Z, M( N
var e=document.getElementById("contents");//对象是contents 5 l. V* g( Z: r
e.select(); //选择对象 * B2 V! U- }( g+ t1 k. r- z
tag=document.execCommand("Copy"); //执行浏览器复制命令
) J2 r( J: N2 u
if(tag){
( M) I3 x/ L; h! P( L9 H
alert('复制内容成功');7 _# f0 t; r5 a% e
}
( U& Z: a0 D) w6 ~
}
2 F3 ^ W' t2 {: n% J
6 Q0 R q$ `* d% i$ V9 V/ ]) z
</script> ( P- X* }" h: D
<textarea id="contents" cols="40" rows="5"></textarea> \, f9 ]2 U( j4 o3 m8 y, o
<br />, _/ K/ I* I) E
<input type="button" onClick="jsCopy();" value="复制" />6 Q4 V8 s. W* ^+ _* y* P2 O. U/ t
</body>$ z0 w. K1 |) h: O
</html>+ I# Y, z" i- o' h# i. [" y+ r

复制代码

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

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

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