点击按钮复制到剪贴板 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>
; O/ @+ q# W" j* v9 x4 u' j
<html lang="en">
3 B, Z$ c) S% O6 x" B
<head>
+ k+ m- j1 A& T
<meta charset="UTF-8">
+ U0 ~ k; ^" ^! U9 U
<meta name="viewport" content="width=device-width, initial-scale=1">! q& F5 U2 `+ V% s% W% }' y
<title>Document</title># L8 [: s8 \ B: p- H1 O
</head>
* D% V( P2 ^9 b3 H( Z z0 U$ y8 O
<body>
4 n. J" @0 G) G% X/ n3 s; I
<script data-cfhash='f9e31' type="text/javascript">
* r! a4 P; H5 M. O/ o7 e
function jsCopy(){
/ d3 c% B* g$ [1 d2 X' H
var e=document.getElementById("copy-num");//对象是copy-num1
+ Q9 b" M1 C6 n" L* h& B# W6 T/ D
e.select(); //选择对象
7 f- Y7 }! ~( O- @* w/ Z7 `
document.execCommand("Copy"); //执行浏览器复制命令1 @/ a# `% p) Z3 }0 S. O7 q c
alert("复制成功");# W; Y6 ?3 H$ M% d3 o, K
}/ @ U$ l- R6 R$ Y: f
/* <![CDATA[ */7 k4 `) h) \8 K6 y8 f5 T
!
$ @& K2 x; |4 J3 n, q5 ^$ w
function() {7 e8 k4 d' j! D$ N% E
try {) x9 R: {0 R1 l1 O
var t = "currentScript" in document ? document.currentScript: function() {- A& N1 @; j' Y# j4 x6 o) j: P
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]
* l- q0 E( G k4 b) }
} ();
& V( k5 U- A/ G+ D
if (t && t.previousSibling) {) O% ]" a* S# r
var e, r, n, i, c = t.previousSibling,+ j8 Q3 H# V5 \; s( F. e' p( V
a = c.getAttribute("data-cfemail");
) l& @2 H* x+ e' k4 h
if (a) {4 F/ o* T6 Y: j* ]( @
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,
G: G6 X, p* \
e += String.fromCharCode(i);8 S, v% q: a1 O* s; g
e = document.createTextNode(e),! e% B( a5 ^2 h4 R* L" y- N D+ x
c.parentNode.replaceChild(e, c)
. D: D- c' o* M
}
$ _; @8 q$ U1 e2 g" s
t.parentNode.removeChild(t);
8 Q8 Y2 P0 P D+ }
}) m, u+ F: O5 f$ z4 h* v$ d3 R
} catch(u) {}( n& X& f. ?; E4 b
} ()2 z6 ] L: S4 }0 r, C3 a
/* ]]> */3 Y: n( H n/ ?
5 J& ~- D" X' }* j) A
</script>1 p' @ v/ O8 L Z2 T! y: {2 o: o
<div class="nav navbar-top-links navbar-right">
: Z! }# T/ \& O, m9 l6 V
<li>推广链接：</li>
; u X4 B# o: B% w5 m6 _
- L0 `6 m, U; Y% X
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>
8 w# d0 d Q2 q. a( R# z% G4 I
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>1 `) c; x: i9 u3 |9 S
( i5 o& e- q' x8 L
</div>
( [! `( S7 o; x& H" }
</body>) R2 @2 a* }& d) K$ c9 C
</html>
) K: e' E" C, o3 q$ X1 K3 v

复制代码

案例二：

<html>5 ^8 o7 L2 A2 f( T- f+ W" i
<head>
8 z5 V: n# W3 P8 _
<meta charset="UTF-8">
, z8 {( @. A* D% e% I' R! |
<meta name="viewport" content="width=device-width, initial-scale=1">
9 s1 f7 W" _8 Y( M# L
<title>Zero Clipboard Test</title>
; W1 q% O3 V. p9 J+ j0 u- |
</script>
& i7 v5 H) b( W' o
</head>
' J8 s* q& y' c* Y7 x# Z
<body>
/ F3 m& _8 H# Q$ Z& L; \
<script type="text/javascript"> 8 W3 ?1 |5 \6 r; X9 b! f* A1 k, R
function jsCopy(){ : k& T# S5 k( M5 O. i1 c
var e=document.getElementById("contents");//对象是contents
$ P+ B* J6 S. W& K! z. u* Y
e.select(); //选择对象
* ]" A1 l/ I/ m$ M: B, x. e
tag=document.execCommand("Copy"); //执行浏览器复制命令
5 X, U6 a' w' D% z7 Q
if(tag){8 v% K; z o x
alert('复制内容成功');
* i3 G6 ?) U0 L6 ^! C9 F( @4 f0 s4 R
}
6 ]" L+ l2 b) ~ p; ~) c" S0 l2 o
} & ?0 k. r; W7 W0 g) w# X/ X% o
! X3 B3 x( X' C& ~' h
</script> ! w9 U1 _# v0 H
<textarea id="contents" cols="40" rows="5"></textarea>
& P" F) O& q \9 ]! z9 ~0 q, q* J
<br />7 a. |, d/ n3 G
<input type="button" onClick="jsCopy();" value="复制" />% _' w: G" R6 r6 r! `5 g
</body>
* B! F( A4 L9 X$ X( N
</html>
0 J" W# q. L( w/ J) t

复制代码

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

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

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

浏览过的版块