点击按钮复制到剪贴板 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>5 g- D- K E% z) \9 {
<html lang="en">
9 q. y& C! \$ }# b8 E4 ?
<head>
! z! s8 E Z' s6 [# U
<meta charset="UTF-8">
' T0 y. p5 q/ G7 K; g
<meta name="viewport" content="width=device-width, initial-scale=1">+ M- \- Z6 N. o) `7 i; D, v
<title>Document</title>
* S) S( t% K5 p; s/ U7 n
</head>) S6 `4 n& T4 r8 Y9 A7 {& T0 U
<body>. ], U5 |' d* Q% B" t5 q+ z, ]: i
<script data-cfhash='f9e31' type="text/javascript">
* A7 a+ ^. G! ^
function jsCopy(){
! [1 W% v' p: B$ Q
var e=document.getElementById("copy-num");//对象是copy-num1
$ V% Y0 l( ]& ]3 @0 `# }9 s& |7 W
e.select(); //选择对象, l0 S' f: Q7 ]0 S& d
document.execCommand("Copy"); //执行浏览器复制命令3 O- U/ O4 I2 n3 p) ~! W0 I
alert("复制成功");
/ v2 A5 A0 W3 _; o; ?4 }
}
" X: i/ C, q% m
/* <![CDATA[ */
( d% Y$ g, H1 m+ D3 D' O8 F
!7 Y' T! t( ^- t o2 @6 L" R7 O$ O, r
function() {
; W- |; Y" Y3 `& {. ^: ^
try {) k1 `& S) }$ e7 X2 g
var t = "currentScript" in document ? document.currentScript: function() {) B$ C* Z" E: k- e0 T, T
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]* p) O O" s; B" @" N% u0 w
} ();- I) l! K* q4 e+ U' ^
if (t && t.previousSibling) { G3 v3 w( D3 ^
var e, r, n, i, c = t.previousSibling,# d0 d, i% U, b& Z
a = c.getAttribute("data-cfemail");* s( a) n, r+ N/ _! e
if (a) {
0 f% ~/ G, t+ R3 s! 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,! m, n0 k9 |& N" h" q
e += String.fromCharCode(i);
( W) a. q6 Z# r1 P3 W
e = document.createTextNode(e),
- q* C! X/ t/ N) }9 `) }9 h; L7 C
c.parentNode.replaceChild(e, c)
8 C- u; [6 L, n2 x' E* ~. S
}+ J x& f5 i) k, R% ^/ w/ @7 U& u
t.parentNode.removeChild(t);- f4 [4 h5 F' U3 t- s- e
}. H: V/ C+ c5 Q. r1 L
} catch(u) {}5 S4 q- r) {- ]3 ?# Y2 F, q
} ()
2 f, f/ e' { F D) n- N
/* ]]> */6 H1 i! a* F. h; h5 | _1 P1 G
3 ~: x3 ^7 X& p. z7 B
</script>
6 w0 }& ]; i9 O5 `7 ^
<div class="nav navbar-top-links navbar-right">
p$ b& u N* S8 k# M
<li>推广链接：</li>
( _$ Q1 D2 G) B, }+ Y. C
8 e/ m' D& Q9 d9 G: u# 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># A9 {6 e/ a. l" k* R
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>2 r; \7 n0 x- B0 P# v& G$ }' {
# [" Q* Q3 Z/ g6 k8 w, Q
</div>* [) |8 x4 f$ [$ ^% L, B3 D/ }- d- n- ~
</body>, b, l1 q; H# x2 r* N. _7 g) K
</html>& g( B- u! ~5 P

复制代码

案例二：

<html>* j2 R$ [2 U, r
<head>; F: h* Z; }$ \$ ~2 m
<meta charset="UTF-8">. I/ W4 m# c5 u6 e$ H+ L
<meta name="viewport" content="width=device-width, initial-scale=1">
0 e/ k; U/ K0 k& c: g' b
<title>Zero Clipboard Test</title>; c. w, N+ [/ E2 c& |! q- \$ \
</script>
& K& Q. q. e! ^1 J5 x
</head>
5 x, K3 }% r1 \9 d
<body>
4 T0 `/ @' l3 p& c( F7 c$ C
<script type="text/javascript">
% g( {; U: v4 S& }3 _8 p
function jsCopy(){ 7 b+ l q% m& Q2 t' Q
var e=document.getElementById("contents");//对象是contents
" w9 _9 F2 Y3 z% ~5 N" h6 O8 y7 B
e.select(); //选择对象 1 P6 m6 M# E# O
tag=document.execCommand("Copy"); //执行浏览器复制命令5 {" U R, q0 [; H: [
if(tag){3 N# `- T' b F
alert('复制内容成功');7 E6 }4 L$ B/ q) H( s, Z6 N, F
}$ e; X; y) ?9 N
}
8 r) l* k* f6 [% q; r
9 I A% O {" d+ m: d
</script> . K X* K6 U$ M9 s9 v$ }3 y
<textarea id="contents" cols="40" rows="5"></textarea>0 o/ M! G$ b1 Y0 e
<br />
% p# ~4 l* E& a
<input type="button" onClick="jsCopy();" value="复制" />" _+ |/ K* N+ i* ]3 J6 V! m$ w C$ A
</body>
5 u3 D- w" `: Y/ R5 C7 Q
</html>; D" ^7 b$ F- f6 A0 A7 p) C

复制代码

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

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

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