点击按钮复制到剪贴板 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>
L7 c& X8 J9 W2 n6 W# Q
<html lang="en">/ g; n) X" Q2 {0 u" a# T1 a8 I( s# W
<head>
3 s. Z0 @2 j: J4 ?8 q
<meta charset="UTF-8">
9 h7 ]0 H, o3 o% ]' W7 R3 V8 _
<meta name="viewport" content="width=device-width, initial-scale=1">' S3 D& l+ S! m ]) I: R) Z
<title>Document</title>+ U8 |' m9 I4 g2 s8 ?
</head>
( s" P9 o# y2 t
<body>
# |9 f: T" x% I1 l* t
<script data-cfhash='f9e31' type="text/javascript">
" B0 _1 |* H+ a- a& g
function jsCopy(){
1 @1 V# ^* s. }& h* @2 W* w+ T8 z
var e=document.getElementById("copy-num");//对象是copy-num1: C- l) L/ w' e& p* q
e.select(); //选择对象5 b& {7 w* N) l1 \9 o
document.execCommand("Copy"); //执行浏览器复制命令3 v9 y4 e5 C( G2 u0 @& \
alert("复制成功");
; D+ u& Z7 C2 W' b
}
k/ r% J) M- ]. v6 ]
/* <![CDATA[ */
9 Q+ M; q/ }/ p( H( L& [
!
7 z4 o* G( J) V- L$ I2 D5 y8 T
function() {
" b( e7 ]4 f1 X" @4 E
try {
# }% M9 M: A' k
var t = "currentScript" in document ? document.currentScript: function() {+ e/ B8 l- H" m' s3 e
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]) W2 K* r* ?2 I: ^! g+ F7 Q
} ();: n& m: e9 W x! `4 Z" ?
if (t && t.previousSibling) {
1 Y% s0 a I2 [9 x. {
var e, r, n, i, c = t.previousSibling,/ Q8 O; h" J( B6 y
a = c.getAttribute("data-cfemail");% G4 n6 H9 u6 O
if (a) {
$ H# l# I' x8 z( z; O
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,
2 R2 _( T) B% n* g5 K- k9 @
e += String.fromCharCode(i);/ w" n2 E3 L. ~+ g4 n. _) ~$ c
e = document.createTextNode(e),
; T2 h0 ~5 z5 j4 H2 G
c.parentNode.replaceChild(e, c)5 e: K" L O; L
}
( f: n8 C+ ~6 V, `& i2 ]6 a
t.parentNode.removeChild(t);6 w) ?7 {( N* g* j: C, }
}
, a3 m% F% ^( S m& M6 H; I
} catch(u) {}4 l! U' f( `: J! b' F+ V* {
} ()
' ]. l7 T' J3 D6 U# B
/* ]]> */
7 d8 ~4 f, U1 F; A1 U6 @' R7 h0 U
2 v9 g9 a% g0 ]+ P [1 J5 A; `
</script>- F- d% g% P% x* g7 C
<div class="nav navbar-top-links navbar-right">9 h3 e0 Z$ e5 w- M# c: c) ?
<li>推广链接：</li>* C' b1 L; H& @" T# N+ V
5 h6 C# z; G! n8 ]5 I3 _3 h6 U
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>
7 `. ?6 y$ Q0 z& r# S
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>
* u+ c! X% y4 [2 j9 x
: t l4 i" \) a0 L" c
</div>
1 Z2 T( U! w- z3 _# W
</body>
% G( e+ ^( K4 i# U- A4 K
</html>
. q! D( D" {- ] n; q% F. l

复制代码

案例二：

<html>" _; j7 M0 G/ N' a M: v' y- r
<head>* d* O6 W6 b4 T6 r( R8 V6 I' v
<meta charset="UTF-8">
% k7 N! ~% {) I; z1 [
<meta name="viewport" content="width=device-width, initial-scale=1">
5 P+ h2 i k. E. `5 R& p5 C
<title>Zero Clipboard Test</title>
. v& F* C0 Y T' J1 B
</script>* M0 d Q8 [$ k. v# W- h
</head>( v0 ? p0 @' ?+ A% K0 o
<body>: R% ^1 Z! Q+ i3 b( j
<script type="text/javascript">
4 _" \9 o& y3 y! ^% q: y6 i
function jsCopy(){
( i' V; S, Y5 _* `; X
var e=document.getElementById("contents");//对象是contents
0 v; l( z7 X" W9 q8 o7 d
e.select(); //选择对象 8 A: D6 C! X# ^9 U# V, P
tag=document.execCommand("Copy"); //执行浏览器复制命令
& h. _$ i1 m) `1 o: k/ f
if(tag){
4 A. r+ m1 k P, B% Z7 ]4 }5 i$ P
alert('复制内容成功');. T: G; u3 r9 |! l
}+ ~1 H# P. z7 w6 }
}
7 v7 r5 U3 H* [* z6 f; f
# s6 @* [: @5 }1 ]
</script>
4 o3 n! I$ r" j
<textarea id="contents" cols="40" rows="5"></textarea>0 U3 s, \6 a* z$ p. I
<br /># [% G# F% e! B3 f) S! z
<input type="button" onClick="jsCopy();" value="复制" />
7 l6 u/ ^- r l e
</body>$ K& y+ R2 Z- \% X5 B
</html>& p7 {6 E8 z S+ P$ b& j

复制代码

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

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

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