点击按钮复制到剪贴板 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>
4 D* v4 S M4 H7 X) x' D' Y
<html lang="en"> F7 E Q! w2 L3 x, k
<head>* I5 Q1 E# w2 p$ [; [. E# p" C
<meta charset="UTF-8">
2 l4 ?, j4 U) Y# D
<meta name="viewport" content="width=device-width, initial-scale=1">
3 a1 `( X/ F% j5 K; g& U
<title>Document</title>" i# W1 ^( _- J- E; }1 s& F
</head>8 Q* m( |8 {! s4 l. y
<body>. g8 z H7 r/ o5 }, f
<script data-cfhash='f9e31' type="text/javascript">2 D; \ ^/ ]1 \: C1 M
function jsCopy(){0 y& Z1 s" T) N6 K+ ?( x
var e=document.getElementById("copy-num");//对象是copy-num1
) x: B$ }3 I" G) K5 G- y
e.select(); //选择对象/ d! ^) |7 Z$ a0 Q* e! f
document.execCommand("Copy"); //执行浏览器复制命令" b6 B/ }+ s; _1 E
alert("复制成功");
( ~! J+ X( Q! R4 n8 f6 |
}
8 k+ o. c* k6 q5 a2 P" y3 o
/* <![CDATA[ */5 C: t% u: A+ ]3 s# O; c" Y
!$ a+ H& y( m6 }4 P
function() {- t% Z# m) \( w( E O# _
try {& \$ Q1 J7 N9 _. D9 g' b
var t = "currentScript" in document ? document.currentScript: function() {
# f6 o% x& b$ n; K9 `& U# e
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]; M) c- \6 w8 u
} ();
# P5 v# n2 X# v' p9 A) C" b$ P
if (t && t.previousSibling) {. ~7 {4 j, V6 `0 i1 U% E# R
var e, r, n, i, c = t.previousSibling,
) \( _% O6 V) W& s' F! X. E- B1 g$ Q3 F
a = c.getAttribute("data-cfemail");6 h; P* z: h4 Q) y8 z9 Z: q
if (a) {. k4 K; v( [. [" u3 E3 j# D- L
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,
5 b1 I J) m" R8 S; s
e += String.fromCharCode(i);
: P$ q5 i$ ?5 e# h" w, d2 d
e = document.createTextNode(e),
+ O0 S1 u. H' L' B8 v' f! Q
c.parentNode.replaceChild(e, c)$ T9 ^6 }8 N1 d; }) ~+ W$ U
} n& W% D; b- p* H
t.parentNode.removeChild(t);- Q2 ~* P$ q- j2 U, a+ I0 m1 J8 m
}" Z$ t& @* {% i
} catch(u) {}: d# A: i# S! `
} ()
1 e: a4 I; L0 I
/* ]]> *// g8 O4 \( T& Z* y/ e
) U1 W# R; U# X8 M% q& V
</script>
C8 D! J8 v& J
<div class="nav navbar-top-links navbar-right">
( b# T7 { R' U5 {- z
<li>推广链接：</li>
: g" T8 A& E3 ^
( N$ D+ T4 {1 M7 S u) C
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>
# ~; v1 K* P' P |
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>
( N1 q; y/ v! `% a: }2 Z3 a5 U
- j# o3 r. x. _& X# W
</div>
6 k. ^! n; T7 x2 N
</body>: u3 J! ^6 I0 w8 \5 M. r
</html>

复制代码

案例二：

<html>0 `) J+ `3 o) z" {
<head>
) O$ O0 C# m+ T; M5 m% a
<meta charset="UTF-8"> F3 y9 | U( o3 O% Y6 y
<meta name="viewport" content="width=device-width, initial-scale=1"> u: r& F* h$ V% m5 N# Y
<title>Zero Clipboard Test</title>
' }& A4 O) y. y% V: c9 @
</script>, v f9 Y8 ]! o2 l8 B' h' l
</head>5 H7 o8 E; h6 P* z# ^: G8 V+ `
<body>
; O0 e* F' @% w$ n4 |
<script type="text/javascript">
& O: t, F0 G) U
function jsCopy(){
9 |- `; }7 _* Z- V
var e=document.getElementById("contents");//对象是contents
9 ]7 l) G8 ?! e9 h
e.select(); //选择对象
7 R" c, ^% f+ y/ M! f- |5 `3 A
tag=document.execCommand("Copy"); //执行浏览器复制命令: r7 w2 S+ ]2 z, i q* \) _' n
if(tag){( V! [% r. m [
alert('复制内容成功');
+ y7 Y0 S1 Q+ I% S
}
- _6 c, c- @: }
} ) \ A' P7 U* g
</script> / D$ e: h$ f/ u u: ?
<textarea id="contents" cols="40" rows="5"></textarea> @! o7 c0 T8 y$ n o5 M9 ~
<br />
+ A& M7 K+ k+ Q8 H
<input type="button" onClick="jsCopy();" value="复制" />$ U$ J$ v h. S2 K v- ~
</body>
/ J6 M1 Z3 r; v# L. H8 O W
</html> h, T4 a! u5 z8 U8 J8 w$ p

复制代码

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

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

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