点击按钮复制到剪贴板 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>
5 P& ?& r: g5 w* c$ b2 p
<html lang="en">
" j. g5 V: B0 W* u! A
<head>4 z" t- O; u0 `$ y4 S, R/ @, _. K
<meta charset="UTF-8">
. R7 X+ ]2 E% }( ^! Q8 P
<meta name="viewport" content="width=device-width, initial-scale=1">* Q( w& Q* g+ D0 i- |
<title>Document</title>9 \" j$ C9 E" c2 y3 w" h
</head>
/ ]+ O% ?0 I8 A
<body>. Y/ @& p- e0 [7 B3 A2 h' {
<script data-cfhash='f9e31' type="text/javascript">
3 o2 t ]$ W1 H. C
function jsCopy(){7 M6 N4 a7 U$ W* | \* e& `7 J
var e=document.getElementById("copy-num");//对象是copy-num1
' J) _1 w* \) ~
e.select(); //选择对象
( h3 g: f; ?' `: L# V
document.execCommand("Copy"); //执行浏览器复制命令
$ [9 M( {! x5 T" x$ D
alert("复制成功");7 l( W8 ~2 V; E, `% [9 U1 ?
}" f! m9 x4 r4 U* g! \$ P8 O
/* <![CDATA[ */
t! o X) |( ?' {6 e# r; l K
!
9 ^2 ~" v; o1 n
function() {
; N k; n$ q5 b% i( i! N; z
try {
2 P* L' g7 v/ j! w0 H2 X( [; P
var t = "currentScript" in document ? document.currentScript: function() {5 ^# e7 W c. }$ v& J* d
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]
: G1 ^: o' L0 E7 _! g6 T5 Y A' q
} ();
" C6 J) }/ c0 C! m0 h. \2 v+ o4 F
if (t && t.previousSibling) {- c3 g) R1 h) I* Z! t9 f$ f a$ f
var e, r, n, i, c = t.previousSibling,
0 S) s1 u" ]9 P- P. c5 X9 \
a = c.getAttribute("data-cfemail");7 N9 h' d" W1 w; \' _, n
if (a) {
" b) S2 n$ _6 p+ N+ ^
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,
) p9 d, X) B' `; Y8 \3 o
e += String.fromCharCode(i);$ y* Y, O# e% }- e7 R7 F
e = document.createTextNode(e),
0 Q- e ^$ {+ a
c.parentNode.replaceChild(e, c)' D7 s9 i- C3 A& l5 b# A
}
b/ O; M! M g: _: b
t.parentNode.removeChild(t);
/ y6 f# z% m j: e# H1 K8 h
}
4 P+ A, T! x" k6 q3 K
} catch(u) {}
7 v6 \$ R" G) l f1 `2 i4 U3 F
} ()# W6 o4 {: ~5 n# ~
/* ]]> */5 Y& q) |, M$ n9 P5 x* m
0 v1 r% @( R# t% M
</script># w5 P [3 w& o, f' Z, i; B. d
<div class="nav navbar-top-links navbar-right">/ f& h1 Z2 [4 |, B3 ]
<li>推广链接：</li>4 v& s: m1 h# ?, G9 g) V
9 u2 A' @. z9 G+ m0 P$ Y+ V
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>
5 s L$ s0 N/ \& b7 r4 J
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>
1 F$ |- R4 ?1 I* D, _$ Y
) B1 b- p0 R8 \# a0 p+ D
</div>, T7 `7 k/ [( z
</body>1 | P; u2 x* j* Y
</html>
5 n8 Q- d4 e$ y) x3 s$ `+ E

复制代码

案例二：

<html>
2 O# r4 q! t+ M' C) v
<head>
9 T( |3 G) n+ Q' h. g! g
<meta charset="UTF-8">
0 ?4 q& o$ a) ]5 N9 B% p- {
<meta name="viewport" content="width=device-width, initial-scale=1">
$ E( B! R$ j% c% W3 u
<title>Zero Clipboard Test</title>
) L1 H! g$ _0 |
</script>7 O/ @; z( n( x0 I1 ~
</head>
E9 Y+ |: Z- K, `4 A8 T, ?
<body>
* O1 _6 V9 B7 ~! e( f6 I$ I3 V1 f
<script type="text/javascript"> ! n G _! z8 n% m
function jsCopy(){
* K1 N6 b9 u, p: F! F
var e=document.getElementById("contents");//对象是contents ) W0 }. S" J, A: [7 G5 ~; z
e.select(); //选择对象
V6 p1 E t% j( V; u
tag=document.execCommand("Copy"); //执行浏览器复制命令
' u. k' L- v0 q1 n- i6 [7 g
if(tag){ X% m; p$ g2 w- r1 ?! j& T7 x G: l; y
alert('复制内容成功');6 d, F0 ^8 B* v% m) Y
}
7 q' M6 f0 V( Y6 s6 ]
}
1 V% }+ q h, H, H- G. P
/ V5 E1 l+ ]5 ^& W
</script>
5 f8 Q! e: l$ v9 y
<textarea id="contents" cols="40" rows="5"></textarea>- Y9 _) Q5 c+ ?$ U* M# s# n
<br />/ D4 S% z3 d! ~" ?7 x
<input type="button" onClick="jsCopy();" value="复制" />+ l9 Z5 J! q2 f/ K5 \
</body>
! @: ]8 Z7 h$ a& G- z% N. Y/ d
</html>
' o* E* t. @& W1 I% E% \. \1 x1 i

复制代码

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

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

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