点击按钮复制到剪贴板 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>
/ x1 k; k. [* P) M: f' D7 {: {! {
<html lang="en">( T) a: k$ o4 j1 \$ m
<head>2 r$ r" L# ~/ K# B* f
<meta charset="UTF-8">$ o/ J) A( X) ]/ N6 ]" r
<meta name="viewport" content="width=device-width, initial-scale=1">
1 v7 }# l" X+ c0 [" q" M/ k: {0 ^
<title>Document</title>
1 i r: Z8 q$ E1 d( j5 ?$ ^5 g. A* g
</head>4 W9 q" t! |: u3 R+ I$ V
<body>+ O5 V5 m& K* S0 ?
<script data-cfhash='f9e31' type="text/javascript">" j) q8 O7 ]( |1 ~# Y- |- ^ ^
function jsCopy(){( L; I5 k& i- U8 v: `) O; A# _
var e=document.getElementById("copy-num");//对象是copy-num1
* N' j' [2 J8 L
e.select(); //选择对象
7 P0 g+ u v9 ^ p, |
document.execCommand("Copy"); //执行浏览器复制命令
7 ?4 E7 T* X |0 ?7 N
alert("复制成功");6 F+ p! x1 N! x- y. _9 T8 |4 w
}
8 L L" h8 ]7 [' G. X
/* <![CDATA[ */
2 ^ W- q! C% Y' e6 R$ T8 J/ {) H
!
7 Q, ^0 V* N8 @
function() {
$ V" H7 c2 _1 `: s- y5 Q
try {. w1 H2 J- a: t: L
var t = "currentScript" in document ? document.currentScript: function() {
, P; o& W, R9 t8 ^3 U
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]
|2 n3 T7 b/ c+ R. _- t
} ();
+ P# q8 s4 ^: b- L1 e8 V" P; p
if (t && t.previousSibling) {5 d. R6 w5 j- |* o9 b$ {
var e, r, n, i, c = t.previousSibling,
" k6 O, C) b n. L2 w
a = c.getAttribute("data-cfemail");% J w4 E& J$ {+ z
if (a) {8 S0 ^1 n/ h+ a6 P: Q3 ^1 G/ E9 c1 T
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,
% D X' S7 u2 w' B0 M! r
e += String.fromCharCode(i);6 X8 F! o+ A) A% X6 {
e = document.createTextNode(e),8 w3 p. m& q2 }4 S+ ~5 Q8 j3 J/ ]
c.parentNode.replaceChild(e, c)
, @' @( _8 C' T% ~; S5 g
}& S% l1 F' z5 G8 o0 `8 @
t.parentNode.removeChild(t);7 y, t, G. A6 N, i+ S) E
}
$ ]4 }* y0 K2 A5 d8 ^+ P. v
} catch(u) {}) Z) }' r# c% }8 Q- r4 P
} ()
) K6 \- t1 }9 g
/* ]]> */
5 q8 n. J* M! e/ ?8 n7 w
# l1 D+ r% L% r- {' B. L: `
</script>" b1 I' v3 `! b$ e" n+ i* d; B. { @
<div class="nav navbar-top-links navbar-right">
2 A7 y" L* f% d9 H
<li>推广链接：</li>
; I5 \: q: [! Z5 [+ }7 [9 w
1 d- k; }1 |) s" u0 J# q
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>
& f2 @" n' p" X' A" {; g6 y7 B
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>
4 w. E9 v6 b# {' y8 l7 }
7 q( Z7 q# K3 n( r) y) s4 v' ~
</div>6 T2 j! _% P& i L- r, m
</body>( u* u9 G# d _/ m5 n, c# D/ j
</html>
. T! [: ?% i& T0 ?2 q) }. ?9 l3 a7 n

复制代码

案例二：

<html>
; S2 B+ Y; l* r1 Y" B* f
<head>
: _! c$ ^0 l& ^* f- d+ t: I
<meta charset="UTF-8">- [3 W5 ^( E: e; _; t$ v) L2 I/ j
<meta name="viewport" content="width=device-width, initial-scale=1">
& A' l o) |9 \7 {, A- Z* \# W
<title>Zero Clipboard Test</title>1 ^! r8 B+ Y4 k7 W2 L
</script>% g4 f, M3 i a, D0 T) P0 ^
</head>& T" Q" _: E. {% I0 o5 t
<body>
( W/ |2 m3 [1 I) q/ K
<script type="text/javascript">
! o' M+ d! U7 Z- F
function jsCopy(){
3 r: J$ \- ^5 r1 @$ W+ X) Y( g
var e=document.getElementById("contents");//对象是contents . I: n0 ~: P4 A4 N0 G- Z
e.select(); //选择对象
. J+ d: I8 c) K! s l, F% f
tag=document.execCommand("Copy"); //执行浏览器复制命令
+ B* T5 {( |* a7 b- h W
if(tag){# C" _- F l# V G: ?- {' ^2 a
alert('复制内容成功');
4 a8 [# p2 O1 s; H( `. h9 A) D+ d
}
* r8 Q) G: {. Q/ o7 U" k0 e- f
}
! Q5 v* ~( s4 J l! R0 k
4 {0 D" c/ a, e2 I* y& s
</script> ; J/ T3 {7 A+ p2 v7 s" J% {8 o
<textarea id="contents" cols="40" rows="5"></textarea>1 Y/ E, @# l/ C5 e+ t3 D! T8 g
<br />7 z) H' D! c; i. p6 d4 h
<input type="button" onClick="jsCopy();" value="复制" />
7 j& v; v3 X- M
</body>
7 v4 D$ V) y6 P8 \3 ^
</html>: L+ x" _6 ^* I0 n

复制代码

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

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

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