点击按钮复制到剪贴板 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>
) S$ n) Z) t8 v [$ v
<html lang="en">
" t( o1 L. C) d- b1 y+ `, s
<head>: ]7 C$ J7 `. P. Y. O3 O5 f
<meta charset="UTF-8">
8 V) Z/ N6 t$ V6 M2 I
<meta name="viewport" content="width=device-width, initial-scale=1">
7 w5 f6 a) [9 d7 j
<title>Document</title>
; H2 _1 F" {* N o
</head>. {7 D }6 S" V2 d: \) M7 C; ?
<body>: [% o: P0 ^8 }/ C3 V! _; y, ?' J
<script data-cfhash='f9e31' type="text/javascript">
) c( @; `- ~( o$ s l
function jsCopy(){% [) g9 Y. I$ c3 y. R
var e=document.getElementById("copy-num");//对象是copy-num1
2 l0 s% c, G! ]
e.select(); //选择对象
) a F: H% L1 R( t' P
document.execCommand("Copy"); //执行浏览器复制命令
0 {1 Q* R6 A6 V& ?7 H1 k1 F
alert("复制成功");
6 ]2 _9 C1 [7 W* n9 b5 m9 C! U3 ]
}9 J9 I( t. Z$ |) k; N4 L) ]
/* <![CDATA[ */5 m5 t7 ~0 P" x) g" g( z
!
" X1 a8 b7 x8 m3 ^* {
function() {
7 S! c( {+ b3 N+ s/ Y7 e6 A% m
try {
/ A1 J, C2 {: u, g
var t = "currentScript" in document ? document.currentScript: function() {
* h+ O% L' ]: g2 j7 Z! W9 l/ N
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]* S) e g0 o$ q3 A9 ~# W% l
} ();/ }8 b4 |" Y; I( y; {
if (t && t.previousSibling) {6 U/ S3 N* b5 M
var e, r, n, i, c = t.previousSibling,3 t9 t( P- G! x) O
a = c.getAttribute("data-cfemail");8 ^& H2 [7 d8 n4 d) m, |7 a/ g3 [
if (a) {" B4 }% \; L+ L2 \ a
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,! G7 \! }5 ^; ]! b* O6 ^
e += String.fromCharCode(i);; s. ^% W) L( \9 P: L! @
e = document.createTextNode(e),
$ [0 N7 p; J/ L6 t, o
c.parentNode.replaceChild(e, c)' F. S% g- E1 g, g
}
! X2 `$ G Q# d. J/ ?' S0 ^& G1 R
t.parentNode.removeChild(t);
+ p. F0 Z/ q& Q
}
9 o+ v2 z! x! q/ T" r8 A, F
} catch(u) {}
( \7 k0 ^1 P8 @5 \/ G3 ]) n) x# ?
} ()9 |; ]2 q, W/ N0 v p
/* ]]> */, _6 n5 k0 X6 c3 }- G+ i
: i7 e1 o0 v0 d
</script>0 D! ?! y8 _5 S' I; b
<div class="nav navbar-top-links navbar-right">, }3 B o0 n' H) p C0 y) K) e
<li>推广链接：</li>8 Q A3 F# \$ S5 [' J+ a+ {! q
) m7 S& Q6 C* d( m" [9 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>4 k. v5 S: r/ {7 I" `
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>
1 X& |0 n2 B) B5 k
+ l; ^) f( p/ Y; C: G: o
</div>
, q( ?/ T+ G; X5 C
</body>) D: c+ O% V/ z) I/ J+ d4 U
</html>) o# Y; _* q* A

复制代码

案例二：

<html>
+ }9 Y: R9 R ^, S5 L
<head>
2 F9 z2 f7 t: H: H3 y
<meta charset="UTF-8">
+ S' y$ Y* |% r/ M. f( y
<meta name="viewport" content="width=device-width, initial-scale=1">! d! y2 ~1 d" U8 a7 u& R
<title>Zero Clipboard Test</title>5 I& Z. g' A7 l! z2 g! C
</script>
; z: L. {- M8 C) t* i8 p" c
</head>
8 Y5 M. i; a3 R. q* _5 B
<body>. }. E# s' ?0 f% e# S- w
<script type="text/javascript"> ) ]- q5 _" b7 p% v" f/ b1 E f
function jsCopy(){
$ G1 U: Q% ` n2 k
var e=document.getElementById("contents");//对象是contents 1 _" T, |8 X& _2 K2 @0 p1 N8 O% W& e
e.select(); //选择对象 7 g' U0 `% ~ R* @! \2 m: B6 M
tag=document.execCommand("Copy"); //执行浏览器复制命令
5 [* h$ s& c8 {# n/ n! \
if(tag){
0 t: ~6 _+ n4 c- V
alert('复制内容成功');
: @, \4 d& S6 }0 [
}# x d& v0 I) R- Z _
} 5 }! a9 L' g2 z/ r: ~
# s/ B( v. ^7 C# ?5 ^* {
</script> ! {% `* z4 L6 \6 Q
<textarea id="contents" cols="40" rows="5"></textarea>
; x( _. W* F# W N$ p3 c6 L& K
<br />
+ D' |0 x- u9 n; T6 f5 b
<input type="button" onClick="jsCopy();" value="复制" />
! H8 r- \4 c4 ]3 E$ M
</body>
' y. p% y3 D" a5 }8 g
</html>
8 k; l/ M2 d+ o7 I& \

复制代码

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

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

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

浏览过的版块