点击按钮复制到剪贴板 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>
8 `" ? R; v H' d4 k- \# x
<html lang="en"># P r \) [6 U9 t3 r( o4 ~3 `
<head>
, \5 r0 R2 ?1 I) f( h
<meta charset="UTF-8">
+ A7 P! \& S# {4 X/ n7 j
<meta name="viewport" content="width=device-width, initial-scale=1">/ e S& }# D4 r. L M
<title>Document</title>) k8 [* S9 @; f$ m/ e
</head>& W4 Z( R. U! V2 I# |
<body>! _+ P9 ^- |; S4 Y
<script data-cfhash='f9e31' type="text/javascript">
3 a& z/ w. k e/ h
function jsCopy(){
5 ~6 w) f2 P* Z8 Q
var e=document.getElementById("copy-num");//对象是copy-num1
9 n& s+ m |/ F7 ]
e.select(); //选择对象8 w% K5 N- b+ q) X2 ~- g
document.execCommand("Copy"); //执行浏览器复制命令) _; y6 [7 }9 I6 B, }5 d( y
alert("复制成功");
) H9 }8 I" m) [% @
}0 F8 ^2 q3 y$ G H8 z, |
/* <![CDATA[ */
: U0 E6 K+ Y9 ~3 x5 l) h
!
Z) o \. z2 A8 t1 ?, W1 @
function() {
- m/ B0 j# X3 I. ]7 }5 A$ O: H
try {. X. p `+ J/ W; K7 {# V1 i0 z
var t = "currentScript" in document ? document.currentScript: function() {
, y L. e8 e" h- f3 \& N
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]% N9 h8 c' b1 g* D! B$ G" e# }
} ();- r d, J* v$ Z
if (t && t.previousSibling) {3 c& P" R: C; b9 C
var e, r, n, i, c = t.previousSibling,* M V. l% `3 q* t1 A( T! s
a = c.getAttribute("data-cfemail");7 C( P3 [( u0 h, A! m" n* B
if (a) {
1 V) E, @* L' I& C
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,- F- N5 ^; D3 _7 q$ r
e += String.fromCharCode(i);
/ J2 U- ^( j- N# g
e = document.createTextNode(e),
( a- m6 S/ V) b1 E$ \- K& T; S5 c* ~
c.parentNode.replaceChild(e, c)
2 z0 F5 ]! W- z; J. `/ J+ M* f
}2 c3 K; Y! S5 B
t.parentNode.removeChild(t);, y3 ?1 H! j* _0 d
}3 ]& m1 _$ _. Q' ~% M
} catch(u) {}% q! O) a. U8 v1 z
} ()
6 h L1 P+ @/ J1 ~+ {
/* ]]> *// h) C9 w$ y8 N( L6 F( B
( D9 S* F$ S5 T$ @- G7 O( K0 W
</script>* X' ^# d; `9 e# |/ W- T
<div class="nav navbar-top-links navbar-right">6 V1 ~1 a# R6 X
<li>推广链接：</li>
$ i6 z% y& C) j; }
9 ^0 ]. k3 [ I" x6 N. A9 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>0 N8 L/ C: x Z( @0 T& Q$ f, ?4 _
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>
8 B% H/ y7 x8 W9 F" e; f4 M- k
4 Z' l# p) k" F* f7 \
</div>) k. @$ P- c9 K# M' D: s& L, k$ x9 x
</body>
' f% a( w3 u' x1 `$ ~- F
</html>
5 ?3 O. @, E( ~3 ?, l; E' x8 V

复制代码

案例二：

<html>
1 u% y* P. o$ U0 R
<head>
5 f8 `5 L9 E4 N8 Y& h: Z% G
<meta charset="UTF-8">
! l. w3 ^8 O0 Z0 F; o& t
<meta name="viewport" content="width=device-width, initial-scale=1">/ b. m% E( e: w! g, v) B
<title>Zero Clipboard Test</title>
" ?. X1 J% I2 W
</script>
) K& d, L3 T' z i( H) Q; S7 u
</head>
; G# Q. Y5 r ?0 u# n4 Z8 Z
<body>
2 u) E l" i' y" Y( A
<script type="text/javascript">
5 |& j0 a& j% Y- D. a; O; U" O
function jsCopy(){ 2 I( R8 b* v$ P7 o
var e=document.getElementById("contents");//对象是contents
) @# k+ u+ A( B. Y
e.select(); //选择对象 " }( S* r# y s) Z- x% M0 Z
tag=document.execCommand("Copy"); //执行浏览器复制命令: q" [6 a& v0 D2 M) i1 h( g
if(tag){6 E1 Q6 K* o4 t2 x2 B1 `
alert('复制内容成功');
, e# Z) d, `! g
}
3 F. E3 `& A' X: P/ t! n, x% b0 s. v
}
/ |0 c V2 _' ?; ]
; {4 i6 m& W& f I% x( `$ L2 C9 f
</script> 8 W/ R7 o3 e, R: Y, {% V+ \
<textarea id="contents" cols="40" rows="5"></textarea>/ \1 Y% S" X& s1 v
<br />
' ~. D! U7 n) ~7 I" n0 _
<input type="button" onClick="jsCopy();" value="复制" />5 ]; B& T; G* _' E
</body>
$ i! w4 Q" t% s9 N8 e+ ]
</html>* ~6 w2 n. h' J

复制代码

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

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

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

浏览过的版块