点击按钮复制到剪贴板 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>/ \2 P0 V6 v+ F0 B
<html lang="en">3 f& T6 t8 g* K9 ?0 g% G6 E
<head>; X# l7 j: r! c# _% g
<meta charset="UTF-8">
' v1 p$ g: f$ }( v- i- w
<meta name="viewport" content="width=device-width, initial-scale=1">
: `$ ?3 \) v# n% d; e
<title>Document</title>7 ?1 A9 _, F5 R" x" H( J- f
</head>. h# x. V9 b! v7 z
<body>6 N! t, d# Y: ]/ ]; j* T' h- ]2 R; i
<script data-cfhash='f9e31' type="text/javascript">
1 ~. O3 h# X2 y$ H q
function jsCopy(){( L: I E' y6 r; u3 }# a; B
var e=document.getElementById("copy-num");//对象是copy-num1. G# x4 {( Y5 a: u% ]
e.select(); //选择对象( F; }" J- \ e5 I7 U, T
document.execCommand("Copy"); //执行浏览器复制命令
3 x" U8 G9 E; i* I
alert("复制成功");7 Y& f1 ]/ L& l& u8 I! R* f
}+ v. @' f$ H+ @. [% w
/* <![CDATA[ */- M) O0 n: ?. H+ s2 J
!( L, |' S/ }4 n0 j. {. g" x2 Q# \! j _
function() {
! b! Z8 I" Y4 i/ T! m
try {9 @( x' O& c4 G; T8 I
var t = "currentScript" in document ? document.currentScript: function() {: G3 N' X9 T& @5 [/ ?0 Z
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]
: N8 D3 ?6 w5 ~" k! `4 h
} ();8 O' B7 i. {! q8 ]0 _! q
if (t && t.previousSibling) {
5 s* ]. B) O7 t5 p2 I2 y
var e, r, n, i, c = t.previousSibling,8 o. @+ {# @* O) P
a = c.getAttribute("data-cfemail");2 _1 J: U" h/ Q: M) R* _- N: x9 o
if (a) {1 y6 P9 X6 q5 R: G
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,2 j5 {$ p" l4 `) i1 W
e += String.fromCharCode(i);5 J: U8 w# F( N1 k! `, F
e = document.createTextNode(e),6 X2 f! |% Y, I8 D i/ J2 [2 w
c.parentNode.replaceChild(e, c)8 j/ {* n4 {; C( ~
}
& H! j" u, m! q" w, h: R* T/ h' s! w$ m
t.parentNode.removeChild(t);/ }. @8 Z, w# p% h
}( h7 r) a+ f: T
} catch(u) {}
$ [, o6 t, X8 D# ~ E
} ()5 R* v' n% z! s$ v! W& \0 j
/* ]]> */
6 s0 |1 }" _$ i, k
% Q6 D& g U$ D% j
</script>
" z4 m: ^8 a& P( P0 U! S, c# l
<div class="nav navbar-top-links navbar-right">0 D1 }; n% a# d. D$ R
<li>推广链接：</li>1 k7 \2 g' P6 r7 P5 F. m4 ?
0 e+ U1 u. S; y8 D
<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 m+ q: H; r( h- b+ a
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>
. u' o: N/ V. k4 s
7 J+ \' c* C* W5 q0 ^5 n: B
</div>
. s% m( i% e- Z
</body>) r6 U+ e* I0 J3 o; H* k) C
</html>
3 @ _+ m) m+ T0 d# v" \: J o1 z

复制代码

案例二：

<html>$ F3 h. z8 S6 t3 S4 k
<head>
! W* |6 S6 Y6 u: v2 s3 M7 x1 g* k& [7 z
<meta charset="UTF-8">
) B( [' B" h4 \' b
<meta name="viewport" content="width=device-width, initial-scale=1">
& `- x0 L4 y5 G1 X1 ]
<title>Zero Clipboard Test</title>( ?5 i7 x8 `3 h
</script>
8 g5 Y5 _" o5 e4 \+ K" Y" P% b
</head>+ ?$ i. O: z4 b% D" r
<body>) |( j; k8 C @% A$ m
<script type="text/javascript">
" Z; l0 @' O6 J; W& S
function jsCopy(){ 9 `# M, x% h+ E" L5 Q9 A+ J0 h# e
var e=document.getElementById("contents");//对象是contents
8 f% v. [* h) h( x
e.select(); //选择对象
7 B* w' y1 t* B& Y E6 p( A
tag=document.execCommand("Copy"); //执行浏览器复制命令
) F9 Z% j2 M6 U6 y1 L
if(tag){
4 L- y; g' I/ U0 G, I2 s
alert('复制内容成功');+ y: S/ u5 x1 h; a6 j
}
' t0 ~, y5 V& N3 y& l/ b
}
; |* m& g9 P# n' j1 {
# v: H& @2 Z8 A+ f- \7 ?) J% G: x
</script> ( h% F% o% O0 F8 w
<textarea id="contents" cols="40" rows="5"></textarea>
6 k: k$ x9 ~) W$ V* o! i0 g& |
<br />
! V' S1 k. Z" _; W
<input type="button" onClick="jsCopy();" value="复制" />
+ ?; v+ @6 y3 p* ]/ B A2 ]1 |
</body>- \( a6 h2 x) G7 p2 v; v' w
</html>
$ h% r! A" C" W+ G

复制代码

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

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

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

浏览过的版块