点击按钮复制到剪贴板 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>
- r) X2 t x% ?# v8 S
<html lang="en">2 z) S% u F' P' _
<head>
' L. x' x! x# M4 H1 `1 V; S
<meta charset="UTF-8">
6 v" J, M: w2 V" e+ I8 S
<meta name="viewport" content="width=device-width, initial-scale=1">* D- [! O8 M1 d w/ D# |; j
<title>Document</title>* ]: B* Q4 H$ j U$ ^) p
</head>
/ r1 w+ b7 N/ Y& Y; d
<body>7 e, u/ P; u7 q- X/ I
<script data-cfhash='f9e31' type="text/javascript">
2 f) H- d8 G5 n L; `; Z( f0 C
function jsCopy(){; [" A0 f8 m3 K8 o0 v
var e=document.getElementById("copy-num");//对象是copy-num1$ @6 R1 z" {: A+ W5 [5 S4 A
e.select(); //选择对象
. M% w( C2 U) f
document.execCommand("Copy"); //执行浏览器复制命令
% Q) w- q% D2 m s) e" Z
alert("复制成功");/ n Z& X# q; d5 E7 [3 _8 m* N" L) L
}
. V' _. P2 G# d) x7 ?
/* <![CDATA[ */% f h3 M; _& n9 ~. v" [( [6 Z
! K% Z8 u2 Z) h: c
function() {
6 H, l8 u; |: b8 ?& E8 X" s* P' d
try {) _. E+ a( H; S; \
var t = "currentScript" in document ? document.currentScript: function() {
8 p& w1 D6 t( I R6 J6 i
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]
' X* \. W6 x- u+ J3 ?
} ();+ e( F+ }7 b; J6 {+ U/ w
if (t && t.previousSibling) {
% ]! S: J I) }" [
var e, r, n, i, c = t.previousSibling,
$ }. q& @. C4 I
a = c.getAttribute("data-cfemail");
5 d- S$ m- }/ p, Y/ S6 a
if (a) {0 @ h+ Y9 S7 X# d+ |6 h1 v. P
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& r/ U' U5 ^: {
e += String.fromCharCode(i);
; @/ C, D4 x8 x9 |+ E0 ?9 E7 t* L8 n
e = document.createTextNode(e),/ `% `6 r: t W
c.parentNode.replaceChild(e, c). ~6 y% _( L: K+ u4 [# ?) n
}
7 f4 x- t3 ^+ H+ a% y
t.parentNode.removeChild(t);& M# s- c1 y! n! G( E6 w& C
}. q# ]. g) w& A* E* Q3 k3 w2 l
} catch(u) {}
& @: H, y4 ~! L( T& V; _" ?/ H
} ()
2 l+ F n% x2 p3 a% f6 G
/* ]]> */
. B/ O: U! V, v: {, n5 U
, E4 W: E0 G; b) o% Q; @0 W
</script>* j7 Y" c; P; n, ?- K7 Z, O' U
<div class="nav navbar-top-links navbar-right">& x1 Y7 s8 U3 r
<li>推广链接：</li>+ i) r. I6 v' K' }% V
* F. a% w! P+ R$ J/ e* m: e, B7 L
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>
1 y7 G4 ?: ^% ~% Q9 b {( B( p
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>5 C' i% k e% ^% ]. g& P$ Q
7 y, L. x& }0 j! T( m. P* k z: j
</div>7 N5 K1 M& l, D5 z; j7 i9 [
</body>2 m6 J) G6 o A, i7 I- @# s' u' |
</html>9 z3 t. |* C1 X+ O; w6 D

复制代码

案例二：

<html>5 j7 o, ]8 k/ l; I. u
<head>
6 O/ p0 Q' B: S3 `2 ]% w% a' r" r
<meta charset="UTF-8">* D! \' z9 ~. b4 m
<meta name="viewport" content="width=device-width, initial-scale=1">; x' V8 r- M( {3 h. ?( L, z- W
<title>Zero Clipboard Test</title>! x0 D+ ? G$ G; o
</script> f+ n* |+ n8 V0 {' F0 S4 c
</head>5 p. F1 L0 G9 a6 \( G: m1 J* z8 y3 b
<body>
7 L# \3 g5 ?8 L" I6 S
<script type="text/javascript">
9 t. p9 X( `0 Y$ }3 I' {! h
function jsCopy(){ 3 m6 p) R" b2 @6 t- p" e% F4 ^& z" @
var e=document.getElementById("contents");//对象是contents 7 w1 e; i6 j" r8 v) Z" G+ h% J, z
e.select(); //选择对象
- m3 B T( d8 k: v$ \9 Q4 X6 e
tag=document.execCommand("Copy"); //执行浏览器复制命令
, f2 a5 G& g X) J9 G0 ?. p1 w
if(tag){3 [ H1 n% C" ]
alert('复制内容成功');
$ ^/ X9 _' x/ f: o4 \
}7 \3 E- B( ?$ X+ _, k
}
# P( r# ?7 ~4 w
7 c* \) u- `2 l5 l3 @
</script> . B" }% x/ g" G$ U; b
<textarea id="contents" cols="40" rows="5"></textarea>
, Q! h% g _8 V
<br />
- R$ l( u! J, s, \3 u+ K w% F
<input type="button" onClick="jsCopy();" value="复制" />& u0 v% r0 a5 a4 X4 {! Z2 L2 {
</body>
) c' t, r, t9 z: g ~# Y7 j+ h
</html>
& r/ P9 } z3 C- `. l6 H

复制代码

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

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

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