点击按钮复制到剪贴板 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>
; [7 y4 G- g; j0 k4 U* S
<html lang="en">- w O" m* T2 W" s$ u! t: \" i( [
<head>9 C- ^' l2 U* V7 M! d
<meta charset="UTF-8">
4 M I1 H# m3 }& p1 j7 |8 `& _# `
<meta name="viewport" content="width=device-width, initial-scale=1">
. ^* ` [) @) k) A
<title>Document</title>9 z" D: z9 q1 p- J) E- A1 ?
</head>
3 P" z: b M1 E/ h! W( i/ E
<body>7 r @2 g& y4 I! ^2 ~6 {
<script data-cfhash='f9e31' type="text/javascript">
. E, g# s* n9 P: F7 k0 t$ a3 a1 t. r. ^
function jsCopy(){
( ?4 i; }( `! k
var e=document.getElementById("copy-num");//对象是copy-num1
R- G: P) e. B9 d6 X2 f9 E3 V
e.select(); //选择对象
' ~* |+ X* Y/ G
document.execCommand("Copy"); //执行浏览器复制命令, e, V6 U0 k% }& k. X, ]: G; D
alert("复制成功");6 V) q$ E; S1 [) i( I+ h& u5 a7 j8 f
}
$ N8 s5 p' U/ e; r
/* <![CDATA[ */
!- ], p9 B3 l$ D7 {
function() {
8 |, O7 [- z6 ]6 l7 s4 E) T
try {. G9 d2 c/ W8 W& E
var t = "currentScript" in document ? document.currentScript: function() {* n$ O6 T- Y# ~ H
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]
4 Z7 A/ H. a/ v* }! A2 u) @
} ();* l$ K8 i7 ?" z! U/ p! F
if (t && t.previousSibling) {
) X* G5 l. m4 C5 L- z$ R
var e, r, n, i, c = t.previousSibling, _, ?3 p% t, f+ V5 A- @, ^
a = c.getAttribute("data-cfemail");
; \% @7 ~8 i- B! ~2 J7 ]
if (a) {4 C/ L- ]- r; l6 ~ W! q
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,1 ~0 |2 d. c, R
e += String.fromCharCode(i);/ S; R' j0 @- v5 [! m3 b# p+ U
e = document.createTextNode(e),
, I- N6 O8 H( r8 @4 w
c.parentNode.replaceChild(e, c)
/ y3 y' c/ L7 t4 e& s
}/ t) U" { ]$ e- w
t.parentNode.removeChild(t);) h8 ^2 ^- W/ [/ e
}
% b5 N1 u1 P/ f3 @
} catch(u) {}
$ w$ ?1 S* S$ M( P7 a% F u
} ()" z0 K: B3 N8 ^, G! P; `
/* ]]> */
& _0 Y0 {. w+ t: x" R9 x$ T$ ~, \5 i
# I- ]' y/ K4 `9 t
</script>
1 F9 |, M$ r& u. S: X
<div class="nav navbar-top-links navbar-right">
' f2 K( e6 G7 q% H: g+ T
<li>推广链接：</li>5 g! S! \& J& q$ a% U
# g4 G9 D/ J% A5 V9 I) M
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>& R) S& t" J" @/ r. v. l
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>$ B3 ?3 V+ N1 K& e, S4 p. b
* Q0 w& F& b1 z& ?, l% u E
</div>
& }1 X0 |1 l1 H! {, L0 i* S
</body>
- G# W. R) P' v
</html>
% ~! ^: X! X) T0 U

复制代码

案例二：

<html>
4 ?: J; Z; J( I# R3 T* m
<head>- L' w9 j* s6 j: m
<meta charset="UTF-8">
, ]3 {, d( C5 `4 ^- n
<meta name="viewport" content="width=device-width, initial-scale=1">
* x) E/ ~! W# P1 @
<title>Zero Clipboard Test</title>: g/ C% f2 n# v1 u: K' b
</script>
( L# U( k% p1 I, }: L
</head>
0 [9 i/ v+ f+ ?, }$ H
<body>
$ |8 ~! u2 z* ?2 u" g0 h3 ] s
<script type="text/javascript">
7 Y3 C3 L/ l Z* |9 i/ F; z
function jsCopy(){ 0 q8 |0 R9 f$ L6 @5 W! V/ |( e; t
var e=document.getElementById("contents");//对象是contents / V' t" b: ~3 l W4 }
e.select(); //选择对象
: t. t. ^2 t$ A6 w" r
tag=document.execCommand("Copy"); //执行浏览器复制命令
6 L+ ~& G6 C7 S; e" y' J& b7 G$ A" t7 R
if(tag){
* [" y( j0 ]( b
alert('复制内容成功');
9 d1 X# g+ z" r: b
}
; f) [6 d3 S( R! E
} & v( [1 X: m* J/ J
7 C6 H$ L4 w9 q5 g. u) q
</script>
/ O- S2 Y4 L$ ~, ?5 u# q& V
<textarea id="contents" cols="40" rows="5"></textarea>5 u! \4 P" I% Y/ i
<br />: Z' t+ |% l+ A; r) |) T
<input type="button" onClick="jsCopy();" value="复制" />
- ]1 b) `& A6 R5 i
</body>! }3 V" M0 Y: w# t% Q/ C
</html>* H% o9 d& l) ~: v' a

复制代码

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

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

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

浏览过的版块