点击按钮复制到剪贴板 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>- m( ^- Q, \- G- P6 ~. B3 f( S* z
<html lang="en">
. c/ ~: E$ T( P$ {' g- G+ |8 R
<head>% [6 `% J% r2 o
<meta charset="UTF-8">: \1 C% m7 {' h: f5 u/ f
<meta name="viewport" content="width=device-width, initial-scale=1">
( U8 M& B" l$ \1 |6 r9 Q+ b
<title>Document</title>
! M6 Z. E- \+ k5 a
</head>
: u/ q" z+ N$ Q/ V0 U$ L
<body>" }- o6 o9 F% K2 g% r
<script data-cfhash='f9e31' type="text/javascript">
+ k- o4 t, z: e/ Y2 _4 f1 u
function jsCopy(){2 z+ {) M5 L2 ~/ n9 N7 w
var e=document.getElementById("copy-num");//对象是copy-num1% m# a2 Z9 ? ?7 v2 n: Y
e.select(); //选择对象
; X; |* s& c- d7 w3 n) N- \
document.execCommand("Copy"); //执行浏览器复制命令
: |+ }! v; b' v$ v
alert("复制成功");1 q6 X& j9 i; m I
}
5 a- I$ ]/ O! E* l( {
/* <![CDATA[ */' [" x- T/ w9 P
!
' k# [1 B& W( i+ [0 |/ x; n5 X: m
function() {8 ^! j* q0 c7 Z
try {
8 T( {( d4 k5 S# n- h n+ Y' R
var t = "currentScript" in document ? document.currentScript: function() {% O, L' d* T! K- H3 D
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]
; n2 O0 p; j' f, D3 ^3 U1 j" L2 n
} ();
( l, d# F: I& ^( k: ]- `2 H
if (t && t.previousSibling) {: W1 ]# @1 X& s, ?/ t: [0 e! K. R: C
var e, r, n, i, c = t.previousSibling,
* }$ x0 N( l9 l. `) |0 v9 q
a = c.getAttribute("data-cfemail");
: ~, A6 y1 Z# ~8 t. f: M7 Q
if (a) {
8 E+ S0 {/ C, J
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 i" q) M2 T7 S Y
e += String.fromCharCode(i);
* U- F9 ]3 q; ~7 a6 j# y i& c( O% S
e = document.createTextNode(e),
! X$ T$ }# K6 i. s) \- \+ W! [5 X
c.parentNode.replaceChild(e, c)
2 p/ |7 P" _- u0 E! P! t
}
* }( Y' k& m+ e- R% s
t.parentNode.removeChild(t);
' s& P6 Q7 I" ~6 y) g2 n' u% V
}
1 M7 o( R& j# g5 r% J' J" |. w2 O+ A/ c
} catch(u) {}4 T! u2 P. X, p/ i
} ()
9 j/ L3 e6 S" l& a
/* ]]> */2 F( Q8 j0 K9 n& c
i, y. C5 I7 Q
</script>
$ i q$ R! |: ~2 Y8 K
<div class="nav navbar-top-links navbar-right">
% C! R6 R' x" N9 j5 e; l# E
<li>推广链接：</li>, k1 r* N; G% t8 P( w: Q
, N+ K9 A- Q% X9 D+ m! e
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>1 k( m( {6 u( J: O7 T( g# Q9 Z
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>
# B2 v( S3 y# c: B
; u7 x4 i. q4 F" g2 X
</div>: t& ^; R# G9 h5 l
</body>% W# ~* K) k+ B M
</html>% V2 n( z4 L' ~ j# i- F2 z7 u

复制代码

案例二：

<html>
/ J* G# c" L2 K/ P6 j
<head>
6 l8 o1 E$ u$ ~5 Z
<meta charset="UTF-8">
, H @2 p' |" U9 `1 i) b
<meta name="viewport" content="width=device-width, initial-scale=1">
4 A# X- e$ o9 t5 ^% E' h4 Y
<title>Zero Clipboard Test</title>
" C2 {: A$ p: R" s+ R* a( U& D
</script>8 `( @' k# w, n
</head>. T# }$ `8 R0 ?- y: E0 {
<body>8 I* Z: Y1 U, A! T& q
<script type="text/javascript">
9 n% J. Q( c7 _ G
function jsCopy(){
% P, I" i% m/ T
var e=document.getElementById("contents");//对象是contents
; W8 e$ B$ j+ Y/ {6 j
e.select(); //选择对象 / x3 d6 [$ h+ D: X
tag=document.execCommand("Copy"); //执行浏览器复制命令
& z) Z! {2 e: z8 I+ U
if(tag){
( Z& K5 _- l9 K n$ B2 z: S- P
alert('复制内容成功');
% v+ Y6 }1 x# g4 e: Y* m) v2 n
}
; u- J1 D+ R8 e
}
6 v( k' f: a( X$ l9 [! _# h* L
/ g7 w: C) b# R4 u3 k
</script>
8 U8 E7 Y2 r, |8 e
<textarea id="contents" cols="40" rows="5"></textarea>
- P- p0 f7 f' I% i
<br />
5 z% v, ~3 v4 ^
<input type="button" onClick="jsCopy();" value="复制" />0 R9 j4 n' T0 x7 T) y3 ^
</body>
, R) o$ K* B3 N$ g3 c
</html>+ r: ` _* c3 [/ P6 h0 e, L" w

复制代码

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

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

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