点击按钮复制到剪贴板 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>" Q$ O7 e8 P2 H. w, r
<html lang="en">
# x7 | c& s9 {
<head>4 Q7 \6 i5 ^4 Z0 r+ G
<meta charset="UTF-8">
" V8 x2 L0 c) c4 t& p4 g/ Z) ?
<meta name="viewport" content="width=device-width, initial-scale=1">- T9 x) v5 }. s" N- V; m% }
<title>Document</title>
, K8 o4 U& p; X# P
</head>
7 i. b& n: @# e! Z5 o
<body>
8 W) N, I9 q% d" o; b" X, r$ S" Q6 b
<script data-cfhash='f9e31' type="text/javascript">+ L0 r2 q% F$ Q, ^* o2 E* V' _. d& L
function jsCopy(){7 h7 U x/ f$ @0 ?/ n. W3 k
var e=document.getElementById("copy-num");//对象是copy-num1
! `# m# E/ L5 z: r& j( }& _
e.select(); //选择对象
5 {+ |- @) z. o- ]. U# i5 B1 O
document.execCommand("Copy"); //执行浏览器复制命令 i* f+ [6 \' j$ d( c
alert("复制成功");
( d. a4 T5 `$ G; ?8 ?7 Z7 O" u
}
3 b5 G- ^) _! E$ L
/* <![CDATA[ */
6 o; [1 o( ^& \2 C5 X9 H0 p
!; J) r4 h* E3 D- I/ o; X: Q
function() {# k& g, r4 c8 F
try { b+ n- q; d7 \ z
var t = "currentScript" in document ? document.currentScript: function() {
% i% F0 j- v( k! ?, \" w/ u. w1 W
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]
% ~. T- [# ]0 W$ }' N7 F4 }
} ();
/ @/ I+ s! H/ d- @* \9 Z
if (t && t.previousSibling) {
5 R& @( Y- w" _- }+ N
var e, r, n, i, c = t.previousSibling,
/ }6 q% }6 i! R1 D* M0 C8 I" `
a = c.getAttribute("data-cfemail"); _- {- H3 A0 z5 \
if (a) {
( Q# ~: L* l2 U! i1 h+ | l$ ~2 e" J
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 H5 C4 E2 l1 D9 X7 n6 q: ^/ Y
e += String.fromCharCode(i);
+ b/ s- W, C: M0 C' W+ g
e = document.createTextNode(e),% n4 q$ j- m# U! r( ^& d2 C
c.parentNode.replaceChild(e, c)
4 T( r- r; K3 \- |' ~
} F2 q: ~1 |, J+ c0 w
t.parentNode.removeChild(t);
8 k* }; M0 y9 T" |7 z, ?
}! v% m# H4 T X5 J# P
} catch(u) {}8 t3 u7 x- u! Q6 W! c/ E4 o
} ()
! E! R; C+ ^' ^( ~
/* ]]> */
5 G8 w/ q' t5 G- d7 J' t
: G' ]. W$ R/ |+ u% a
</script>
* _% S6 ?0 h* k+ u/ P
<div class="nav navbar-top-links navbar-right">
0 K4 U# Y' E7 @$ F( W; M3 Y
<li>推广链接：</li>$ i! w& I* K6 a5 r+ F& O/ t
: B7 `; A! b9 `
<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 G: C& v2 U* Y0 Y2 p* R* N, r
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>
0 H7 A2 m! g3 E! v$ U9 Q m
' j% C8 k4 q- U& t- e: @
</div>8 c/ \" l N e# o
</body>
0 A2 |+ n, K3 B( S9 p" }1 l
</html>" y9 \- d7 \. E6 y9 O' c/ }8 G

复制代码

案例二：

<html>
( S3 m8 [3 X2 D5 N
<head>
3 t1 N" A y4 T3 r! A5 ^
<meta charset="UTF-8">
# ^. l! \+ j& h
<meta name="viewport" content="width=device-width, initial-scale=1">
1 g. ~0 h" P! @/ C. ~
<title>Zero Clipboard Test</title>+ A" g' ]8 a3 U. i W6 C. g5 V7 z
</script>
1 x, y1 }3 ~: L, ` P/ \
</head>4 G* R; K; G# Q1 `5 W2 I1 S2 \
<body>
, T" b8 u) d# _0 m4 s3 L, D
<script type="text/javascript">
& {" m( {) c! k5 g% n5 Q
function jsCopy(){
9 |+ F0 z7 y; I/ ]+ e
var e=document.getElementById("contents");//对象是contents
1 W/ I4 z$ S5 w0 t6 t
e.select(); //选择对象
3 |& g5 h9 f6 X5 Q% |5 Q& O( L
tag=document.execCommand("Copy"); //执行浏览器复制命令2 I0 S9 B) d8 B/ T
if(tag){
2 J, A* Z* P+ ~
alert('复制内容成功');
$ P& y8 c0 d, n, R) l, a
}
5 _2 Z/ G3 c S5 X r1 A. j [
} . O$ r$ U' @, F. Q. U
5 {6 _; T" W' L" o* |
</script> . N8 [0 E7 _# E4 X$ ?5 B
<textarea id="contents" cols="40" rows="5"></textarea>; ?% I5 z2 x1 P+ j
<br />
6 ~: P* b) ^, I' [. v6 Q* r+ d7 Z+ e
<input type="button" onClick="jsCopy();" value="复制" />
2 H+ j5 ~. O. C$ A! I4 l
</body>
7 J+ K% ?' m3 y* ~& S; C+ u9 O
</html>& t( Z7 }+ }8 [: C

复制代码

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

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

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

浏览过的版块