点击按钮复制到剪贴板 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>
* \! m2 c: K \
<html lang="en"># t% l* D$ J. @8 E% ?- l$ V
<head>5 r7 S2 v' W) q: ?% W3 W" Q6 `9 S
<meta charset="UTF-8">: ]# a+ V+ ?8 S3 J
<meta name="viewport" content="width=device-width, initial-scale=1">0 g! M# G6 V+ _1 }
<title>Document</title>
' T- Z: ]# p- L3 ]
</head>
/ B! j y* I* @' {( a0 o
<body>
. f1 n2 t2 z' }, l) ~
<script data-cfhash='f9e31' type="text/javascript">) p. A0 {6 e) R
function jsCopy(){
9 Z, t6 I N6 T, B
var e=document.getElementById("copy-num");//对象是copy-num1
4 V+ g0 S2 x0 [. O% H# C" N
e.select(); //选择对象
4 a; }4 D9 ?! H; k* l
document.execCommand("Copy"); //执行浏览器复制命令
; l0 t6 v. s/ N/ _* d, O) h
alert("复制成功");- Q1 ~4 p& R- m R% d
}
5 n! ]) i: C# ^" t# q" P
/* <![CDATA[ */
# D9 z. G7 X6 {4 P& ^6 F9 l
!6 U7 a! q5 x" h9 c0 P
function() {
: ?# f" i5 \% o( {# I
try { `4 ^: G4 D( a) {* q) _
var t = "currentScript" in document ? document.currentScript: function() {8 c( Y& K o' \5 D
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]
, \4 ]5 ]/ k* v! C3 f( l' ]# ^, {
} ();. G: j$ U1 b1 D) O2 n8 g
if (t && t.previousSibling) {
$ W, j, c# c2 `6 F
var e, r, n, i, c = t.previousSibling,
) V5 _7 O x: i; g) L
a = c.getAttribute("data-cfemail");9 C; `5 w9 T4 S2 e4 k1 Q
if (a) {. D3 ^! B/ p9 n0 H' ]& H7 `
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,( E5 H. A0 K0 C9 x4 v9 x( o
e += String.fromCharCode(i);0 n% `+ ?/ f; E! v: s! C3 W0 O9 L& {
e = document.createTextNode(e),8 e& L. B1 \1 ] k; S
c.parentNode.replaceChild(e, c)
8 ^5 r; [- c! f% ?& t" R9 V
}
% Y1 t T5 E1 W4 N' O5 i
t.parentNode.removeChild(t); Q" g( F' q5 g7 y. m1 t3 T0 c
}
( Q: m) E( I2 N
} catch(u) {}1 I2 \3 f: s' w; o. I* Q
} ()
( D$ e: M6 G- I
/* ]]> */
2 p: ]5 F7 O! F
4 F- @7 M6 s7 B9 X1 V& m+ o. C
</script>4 f- S# W( N% \# ?! M
<div class="nav navbar-top-links navbar-right">
8 q& o" w8 S# v+ u7 M
<li>推广链接：</li>
4 w* p& H5 M1 c& Z" J/ d
( F) \( i1 W: B' m
<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 a4 d; i; K3 E6 E+ P
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>% N$ |' ?2 }6 e% ]3 `
4 q/ c3 c, _; r% f" H4 u
</div>
0 r- K# O5 ?" m5 ]- M* r
</body>
! Y) j6 q" S# @/ [+ }5 O
</html>
! |& s! T0 X2 \; x' ]

复制代码

案例二：

<html># t9 M0 J: o# O
<head>
2 N6 C) s. b3 y+ @
<meta charset="UTF-8">, f' f1 }) M+ _; ?! E
<meta name="viewport" content="width=device-width, initial-scale=1">
/ @" c* {- V F) X" O
<title>Zero Clipboard Test</title> E3 o k9 P! k- E) s
</script>5 l8 P3 L; V" }' u7 Q1 Z
</head>
! A: d% x1 F4 Y+ r" v5 X' [; e
<body>
8 G2 v5 W9 I$ q
<script type="text/javascript">
! B4 W- ]: N" ]8 T) ]* i7 Z: x
function jsCopy(){
9 H. A' P- p, D; f+ A1 D% b
var e=document.getElementById("contents");//对象是contents : l3 I2 Q6 N; @9 S6 u
e.select(); //选择对象
" {# E# w% Y: T: f' B
tag=document.execCommand("Copy"); //执行浏览器复制命令8 i: a% O, |+ u! D0 e2 i
if(tag){& Q" S: G& X- z7 p8 T/ y& K0 M
alert('复制内容成功');8 m" D$ d: T9 H5 x3 F. ?" ^; {* F- s
}2 m5 v8 O/ K, k. w, ~# Z' i' Z
} # n' K) j- E8 |' z# ^* w7 p
& o0 J9 a. Z; t
</script>
+ i9 O; A/ n, }9 w6 a- @
<textarea id="contents" cols="40" rows="5"></textarea>
( ~2 Q. M8 v/ S. i# j% z5 z
<br />8 y6 G6 e; q! d4 I U* M. d
<input type="button" onClick="jsCopy();" value="复制" />
& @# ~* r* t* z! l) v4 G
</body>
+ r$ w) X- z4 P- N
</html>
) b3 w( A, y. R' k4 m4 C

复制代码

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

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

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

浏览过的版块