点击按钮复制到剪贴板 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>% J: J& j5 B% z# H
<html lang="en">: \; b( K6 D- x {5 `) h6 m
<head>* Y# i% Q i$ V8 F0 t- @+ O
<meta charset="UTF-8">
: v! ?9 w; @( }+ u) j: _4 Z1 m
<meta name="viewport" content="width=device-width, initial-scale=1">
+ T. l( H/ ?# D+ _; d
<title>Document</title>; h" s$ q% L* d) V( X* z3 J! @
</head>( w! C6 ~, ?4 T7 u, }
<body>
e7 r7 [4 ]8 y. ]+ q* A! o
<script data-cfhash='f9e31' type="text/javascript">) B! o D" n# J: i$ e k- H% g
function jsCopy(){
5 d% k0 T7 b, \& x
var e=document.getElementById("copy-num");//对象是copy-num1
+ A6 \" \8 m! E' T: v
e.select(); //选择对象8 o- ^8 R% C3 i9 X, }2 j$ [
document.execCommand("Copy"); //执行浏览器复制命令
3 b9 a) U) ~. g4 F5 J' B3 U% [ q
alert("复制成功");& n8 }5 q& [8 W" l9 d4 j$ X, J
}
2 I" V" @* S; M, D# n
/* <![CDATA[ */8 M- J# F$ F+ k2 P; s" h6 \2 [+ m
!
3 z3 B/ G; f% Q: k7 e) U2 y7 c
function() {/ ?! ^+ c( F" u7 Z9 Z; Z4 Z6 ~3 O
try {
) r. i5 L7 a; X4 g6 `* B
var t = "currentScript" in document ? document.currentScript: function() {
5 ]+ u! H$ x, z. ~' k
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]
5 f0 \% z- U8 G4 N
} ();$ ^; M& A1 c3 D1 t; n8 {
if (t && t.previousSibling) {$ `- j$ F+ s, f3 C7 j$ p
var e, r, n, i, c = t.previousSibling,
/ \4 ]* t5 _. q& e" a: d( C
a = c.getAttribute("data-cfemail");
1 E" X- k# N6 C1 ]) h
if (a) {$ W ^, b& Y, D/ L) X( G
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,8 I$ d& J8 A9 b& Z8 f" t7 W
e += String.fromCharCode(i);
* \$ a1 w+ J4 f7 R% V- W1 s
e = document.createTextNode(e),! R) K9 u C" S+ [
c.parentNode.replaceChild(e, c)
. \1 f1 b/ {+ s
}+ F% k/ S+ V4 v* y
t.parentNode.removeChild(t);
) R& F( k; d2 x) I* z5 M
}, p' g4 L7 E3 p. _3 ?9 k% C3 T+ f
} catch(u) {}
" y* \. y9 }" z* j9 p
} ()8 R6 U+ j. L4 H5 Z# e( Y$ _5 x
/* ]]> */
7 v6 }, {' Y0 b% S9 a
$ r: U& B, \5 b
</script>+ ^8 T; n6 H8 @$ R9 ]+ k& m
<div class="nav navbar-top-links navbar-right">3 P# i3 R+ i }% F: h
<li>推广链接：</li># A7 A5 u* e/ B4 i
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>
- O6 |% U+ C$ d, F0 s- q2 `/ Y f
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>- q5 K8 U. o) ?% `
" e7 ^; u3 _9 {! {
</div>5 ]3 G2 \3 U N+ k+ `$ l8 n
</body>
& B0 n$ u1 Z1 r% [
</html>
3 m" u9 z( X/ `

复制代码

案例二：

<html>
. J8 t6 l$ v2 `& P# Z
<head>
: R, ~' l- A% d! a; O! { a7 M
<meta charset="UTF-8">6 {5 ~+ j p+ ]; ?5 E& S8 l
<meta name="viewport" content="width=device-width, initial-scale=1"> d/ G- K! `, c Q
<title>Zero Clipboard Test</title>
" m5 _, _+ j3 l% i3 f
</script>& x' X! X; [3 j8 ?
</head>4 F, r! s- c# S
<body>+ L5 d( S+ `0 M* Q P+ I" Z5 I
<script type="text/javascript"> * o0 R6 a5 Z% B6 i
function jsCopy(){
2 ?; s6 _$ _! v6 O1 u5 u
var e=document.getElementById("contents");//对象是contents
4 {, C" `% z( @* H; i9 y1 p) ?! [
e.select(); //选择对象 , h) t" D1 U: a6 j1 `0 g& u z5 {$ C
tag=document.execCommand("Copy"); //执行浏览器复制命令
u7 F2 u/ w3 q. A: [! `6 W4 j
if(tag){% Z# Z: m8 a$ W% Z4 [
alert('复制内容成功');
2 I1 \% H0 H1 c! j0 Z, E( t; Q; X
}) W! t- V. u4 S' X
} 6 l' c6 ?, y9 j+ R; t* @& l
/ a) S, U4 \5 W$ W( w7 g+ ~# \
</script>
1 j/ z5 E/ D7 i. f
<textarea id="contents" cols="40" rows="5"></textarea>% I' Z9 j' p, Z( l! q/ l0 d8 o/ O
<br />
0 R7 q. E0 p: A
<input type="button" onClick="jsCopy();" value="复制" />3 U \, V* @2 J+ R
</body>
5 f0 h4 M6 O# F$ B! ~8 G- Y' f
</html>
2 o; B4 X W: ~, \+ W: M/ t

复制代码

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

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

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

浏览过的版块