点击按钮复制到剪贴板 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>& i( L6 W8 W# F% ] r
<html lang="en">
0 f8 r' i9 i1 O, n
<head>
! N$ |, Z$ i& _! B+ ^6 x
<meta charset="UTF-8">
" R! m) m7 T, ^" O; D1 f3 J
<meta name="viewport" content="width=device-width, initial-scale=1">1 @% A, U$ t3 w3 D: _8 N7 l5 E
<title>Document</title>
5 D( X5 p& {7 F9 @; N
</head>) J$ r% J2 e- p* y) U# n" c* Q" y
<body>. D1 ~; H% l6 k& i; V; x
<script data-cfhash='f9e31' type="text/javascript">
9 D& L2 y2 g8 n# @
function jsCopy(){7 ?" O3 [/ f' h0 L) ^
var e=document.getElementById("copy-num");//对象是copy-num1
: j+ y: M E- F0 R7 F
e.select(); //选择对象9 }, [- N( p* T
document.execCommand("Copy"); //执行浏览器复制命令
) M3 M- `% l5 w0 {# D M* x
alert("复制成功");
5 m1 Q0 w* D& d: C
}, ?+ u( T2 R+ `/ p( {- F8 y
/* <![CDATA[ */
3 ?% s" e3 o$ ] H. `
!
4 ` @. z( \, c! `
function() {( {% d+ g- v9 v V; M4 G" T: {/ S8 ?
try {- O; j" A ]! Q& _
var t = "currentScript" in document ? document.currentScript: function() {
O1 [: o" J% X
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]2 J* u& F3 h( d
} ();
! O8 ~7 ]0 _) Y! }
if (t && t.previousSibling) {. _) m" C u: \) y1 a$ o
var e, r, n, i, c = t.previousSibling,
4 I. j2 Q+ ^. X* g# M
a = c.getAttribute("data-cfemail");* R& }% U; G2 X T* Z
if (a) {) b% t8 x+ o2 T% X7 e
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,
- K0 x. J$ `6 v- H2 j
e += String.fromCharCode(i);8 U, z6 {6 H: ?1 U2 K- f8 M+ {
e = document.createTextNode(e),
2 i7 E2 |- `! j8 r, k' s
c.parentNode.replaceChild(e, c)) O, z2 c9 G/ a5 B
}
6 T; B; f9 U& ]" \$ r. l
t.parentNode.removeChild(t);
, U' |' F$ ?6 V- w
}+ t4 C; M) i5 ]9 @* _# ~
} catch(u) {}$ a$ D7 O( Q3 C- e. F4 P% [
} ()9 c0 Q* J# t) z4 J) E8 T$ b
/* ]]> */$ o& n5 H, j5 n y
) @! o3 h* U' L2 w1 K0 F& n
</script>/ f! y& S2 N' u0 p% r
<div class="nav navbar-top-links navbar-right">
+ x) e+ H9 r2 X' ~4 e F5 O
<li>推广链接：</li># u5 R9 `/ k, a' y- C( i0 F
" B0 Z/ w' a) I) y8 M2 C4 ~
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>% B5 C5 A( C1 ]
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>$ @' P3 E* \/ ^
' { G) `/ }) r/ M" J4 \1 d
</div>% ~$ K5 q @9 e, h
</body>
, T8 p% b7 U7 |+ S/ O7 P
</html>1 u( Z' c0 E+ d$ t: G

复制代码

案例二：

<html>& }# U8 u2 S" n; \, e
<head>
8 j/ b' Z' p# i9 Q
<meta charset="UTF-8">
% G' r1 x8 h: B2 w: f" [
<meta name="viewport" content="width=device-width, initial-scale=1">
" ?2 i3 x! Z, y
<title>Zero Clipboard Test</title>& k! v/ j/ l, S; O! t6 b
</script>
) d4 L2 w; r. K: J3 F W0 ?
</head>
; _! _- I- q. x0 x: {) F
<body>5 |( t8 `) r: h2 G2 I t. K+ J* t
<script type="text/javascript"> ; s# c. e$ i% u+ I7 K+ K) y
function jsCopy(){ P- n' |2 A( o( U7 C* S/ ]
var e=document.getElementById("contents");//对象是contents
' F/ Z `3 G3 v7 h% _
e.select(); //选择对象 8 C0 R, _, A7 f# A
tag=document.execCommand("Copy"); //执行浏览器复制命令
8 _. U( `! m& ~' s+ L1 s" v
if(tag){4 a: ], E% k9 z) T
alert('复制内容成功');% R2 j' K8 M; U" |5 G3 p
}
; m0 {4 y v; Y6 z) e/ F- L
} 3 g6 U0 u: J# m
E7 ^: a! g/ t" l/ X9 |) V$ I
</script>
, X( f+ u! m8 `! R( N
<textarea id="contents" cols="40" rows="5"></textarea>$ z2 ]* w' X4 v% m
<br />
% u# W; }: y t4 J
<input type="button" onClick="jsCopy();" value="复制" />
: R I& e8 b4 ~2 B1 q. ~
</body>3 E) X& S$ Y' U& C
</html>, @8 U V: Y6 _$ B6 P

复制代码

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

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

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