点击按钮复制到剪贴板 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>
0 u) q, i( a0 n
<html lang="en">. |0 ]) t, `; O+ w
<head>
1 E \- K7 B& }; O
<meta charset="UTF-8">; d# O4 r7 V: f. v; F+ k$ Z$ Q8 ^! C
<meta name="viewport" content="width=device-width, initial-scale=1">
& y6 u( { @ ?3 F8 R' q' L
<title>Document</title>7 f) |6 n" C" f5 x h
</head>3 b6 x1 N5 [8 [3 `
<body>& c4 z# X$ h$ m: ~- B7 k l
<script data-cfhash='f9e31' type="text/javascript">
6 K* O7 J* I( N$ D+ \
function jsCopy(){
8 @- W! k* {3 ?8 ?9 i3 J
var e=document.getElementById("copy-num");//对象是copy-num1
9 h: s9 A) j8 h% H" _
e.select(); //选择对象
" k( A9 B+ S6 _5 s5 I# l7 D
document.execCommand("Copy"); //执行浏览器复制命令
; }& q# O# v' e' r4 G2 N/ X
alert("复制成功");
( E3 R+ x! `! z4 m, o& M
}
' T0 r; i" ]% O" K% Q: k
/* <![CDATA[ */
; c" |4 A/ a7 Z7 M, k) `1 P0 g
!
H( B, b/ d% R0 d2 p6 {6 f* G4 V
function() {. ?; O! _. r3 Q' a% @
try {# Q/ \9 B3 h1 {4 N
var t = "currentScript" in document ? document.currentScript: function() {% V& D2 |8 r( |1 h* c% L
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e], g8 g2 l j2 `8 @, [1 s) {6 ~* T* q
} ();
* _0 ^% h" C: a; J# L/ H
if (t && t.previousSibling) {
: K7 A4 K" c) K
var e, r, n, i, c = t.previousSibling,5 U2 X5 ?$ T- M$ Q5 H: q
a = c.getAttribute("data-cfemail");
1 P5 e: h+ F+ q: K; w0 m8 D" {
if (a) {* i5 G8 G; U8 l8 q2 S
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,
4 [* G) j! \- S+ F. l1 Z1 n
e += String.fromCharCode(i);
( v% B! N5 t% R
e = document.createTextNode(e),
& r5 l, w5 j& j
c.parentNode.replaceChild(e, c): m4 k2 R% T1 Q
}
+ d4 N- R1 P4 o$ B" \% X5 l
t.parentNode.removeChild(t);
) z1 @- S' F7 M* k" k2 X: A1 I
}! J; o: A. w7 c+ @
} catch(u) {}4 ^8 F! Q/ N* Q* M
} (). |1 {: u' T+ x- {' D8 A- ]" U
/* ]]> */$ N+ J9 V5 U$ ~5 H+ a, t! [: f2 C
. }* F/ L2 w# v& m
</script>
9 I" E: u% c; Z
<div class="nav navbar-top-links navbar-right">
<li>推广链接：</li>
2 m+ h& V# I6 i) Y' P0 [
: f' Z# \+ Z( G0 q) N/ L
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>
& M- _% d, ~# U# V& t; P% h" L
2 d. C% V E% ^, ?: m
</div>
5 W( G1 t8 @1 Q8 y2 d7 j
</body>: w/ J2 z; s# E* D; K* N3 H
</html>5 H" K& H: `4 r c }

复制代码

案例二：

<html>7 V+ s+ {* C0 C- S
<head>: Q, ?& ^6 M. R1 n4 E8 {( \/ a* F8 }' M( M
<meta charset="UTF-8">/ ?" V; h/ |( I' l0 Q% A
<meta name="viewport" content="width=device-width, initial-scale=1">+ J: X0 c0 m4 L0 _9 ]9 T7 D
<title>Zero Clipboard Test</title>
5 V1 d- {* k( W) `; k
</script>
9 ]% C# v5 V4 R* W; R# E
</head>3 j) x5 M6 k- @1 z/ X
<body>5 L- c Z Y, O$ T* ~5 }
<script type="text/javascript"> 6 a) O9 f; ?0 j6 t$ r2 ?* K
function jsCopy(){
2 ?' a, F2 Y% o- |* b. V$ z; ]
var e=document.getElementById("contents");//对象是contents
9 z0 I+ ]. G2 j% G/ z
e.select(); //选择对象
# N+ @. h0 S: H
tag=document.execCommand("Copy"); //执行浏览器复制命令
: ?& d# K: L- |
if(tag){; e; [2 |) u1 D7 Q
alert('复制内容成功');+ s4 j6 H* I4 b' X. [7 U, |
}) H$ @1 d+ l2 ^# j9 L
} 4 B+ ?2 `" [: u+ S# o( Q
+ k0 _8 J" O/ J, T* S) _
</script> ; Z/ |9 ]" y6 j# v; b
<textarea id="contents" cols="40" rows="5"></textarea>
' K# m5 h5 z3 o1 M8 I
<br />
" `; m' a! x; ?! O& O& J2 X
<input type="button" onClick="jsCopy();" value="复制" />, V( L* U+ J: ^7 Z( t$ M
</body>
% t2 ~! b1 t7 x2 x/ t4 }
</html>! S4 R; f9 [. r/ ?8 e

复制代码

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

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

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