点击按钮复制到剪贴板 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>, m2 ]* f% {% v2 q4 M- }
<html lang="en">. s4 c5 s# x; x, B& A; n
<head>5 x, A1 I5 l( O" D* y7 R* [& j; i
<meta charset="UTF-8">5 P9 D& g$ f& R6 F) O3 }9 h
<meta name="viewport" content="width=device-width, initial-scale=1">
# N" ^# R) m% ?/ a0 M, `9 G* J; g
<title>Document</title>
6 B, \- a4 `. c7 R
</head>: P+ L& X$ O; S+ T/ V- }0 o( w" _' }
<body>
! J1 ?2 r9 J, p
<script data-cfhash='f9e31' type="text/javascript">& b: P* o) F" t! ~
function jsCopy(){& P2 }- N3 B2 J& z* G1 m1 I
var e=document.getElementById("copy-num");//对象是copy-num18 d& [# P0 q8 C1 A7 V0 R8 U
e.select(); //选择对象
* i9 q9 H+ ~0 Z
document.execCommand("Copy"); //执行浏览器复制命令' X' y# `6 q- {- k
alert("复制成功");
% F- m: D. T5 b4 M8 j7 U( n
}
* z/ H+ ]0 b& J2 n3 w2 _- |7 k
/* <![CDATA[ */
/ y# }9 g- Q# n
!
4 _. e1 a, [% J e
function() {
- |6 y. q3 q2 i% C, f
try {+ k3 B4 W5 m: P+ f
var t = "currentScript" in document ? document.currentScript: function() {
! l) U, r8 M. w- B; E( j
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]# @& k7 n, k4 `4 Y2 J
} ();0 c# O9 o. O( B+ w5 Y
if (t && t.previousSibling) {
$ ^( x( q$ G$ W' L( I
var e, r, n, i, c = t.previousSibling,
( O3 `$ [0 s% L. e9 y' n
a = c.getAttribute("data-cfemail");4 [6 `7 j. O$ z4 P# _
if (a) {
! S# h4 m0 b7 I1 L! R# N
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,3 @ S& q1 ~% A
e += String.fromCharCode(i);8 ~9 Q! ~7 Q j) D
e = document.createTextNode(e),5 g: M8 U' P' g0 D0 U
c.parentNode.replaceChild(e, c)
9 _9 e0 Q; |- A6 J1 R
}
6 o* m4 G; ^ U- \( ~
t.parentNode.removeChild(t);% R+ M2 b ^* E( R4 j9 ]1 a, X
}$ p+ B7 C5 t# b. B; f0 L
} catch(u) {}6 A5 E' a N. _) U3 h( k6 n
} ()& |9 j* T+ n$ [3 f5 e
/* ]]> */
/ g2 S7 ^# U2 X0 f' x
# k3 c7 ]: k3 y1 L
</script>
2 i* |) u9 b! K; T) _& m
<div class="nav navbar-top-links navbar-right">
( g" T: @5 O1 l( A
<li>推广链接：</li>
; [6 W7 ~4 ?! q Z% A# s
' m8 B. O6 q2 f
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>4 y- Y; ~$ E/ C2 |
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>
5 L3 u8 v1 r9 z' O6 B
" K8 _" c9 m" Q+ L+ i {
</div>! P8 H( t; G/ e) Q
</body>
9 N7 w$ _! e1 q
</html>
- H! `/ ?) u( G6 B0 \7 Z \- F6 L

复制代码

案例二：

<html>
2 p: N0 _6 f: t8 R" O) y' G: l
<head># s I% U L- \1 ?0 N
<meta charset="UTF-8">- X+ X6 O ^* L4 O
<meta name="viewport" content="width=device-width, initial-scale=1">
. j$ q2 M, x5 q+ T1 d
<title>Zero Clipboard Test</title>
; y# ]8 h& x& {/ N7 |9 `
</script>
% [7 A5 v/ _. y. o' x
</head>9 O0 p$ J9 k8 t3 d2 k8 ` ?
<body>
/ I# ^) ?7 t; ~; `. N
<script type="text/javascript"> ) N# K- c+ P8 W/ R+ B
function jsCopy(){ ! U! Z! {) ~: e$ F8 { y
var e=document.getElementById("contents");//对象是contents , u; g) _! X9 Q: Q: M/ G
e.select(); //选择对象 - x* @/ F/ r% v
tag=document.execCommand("Copy"); //执行浏览器复制命令; C' C( x/ ]% _+ f! H# ~, f
if(tag){! I" |1 y2 V% x* m" [) b
alert('复制内容成功');
0 _* B. u- I1 e4 D1 \) `) z
}
; J3 B% Z/ @( U+ W5 F1 p$ ^/ b! f
} ; Y) O) i9 Y5 C( A, N5 R1 }
* m' T0 I; G# q* ^3 U
</script> 8 S8 Q- ^! X1 g9 D
<textarea id="contents" cols="40" rows="5"></textarea>
1 W+ v0 b* o. \, K: Y# T* N
<br /># c- ~! l3 b! G$ x! G5 `: e
<input type="button" onClick="jsCopy();" value="复制" />2 j2 l" ?/ W6 X% d
</body>( ?- i$ k8 d* C( y- n
</html>6 N- h% G& `5 ]! ^" o t) b r3 ~9 L, A4 d$ t

复制代码

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

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

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