点击按钮复制到剪贴板 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>1 F6 b# ?) M' ?% r) R+ Z" g
<html lang="en">
" A. q) P$ o$ w( d9 T* o$ m0 b
<head>; n$ R+ P% C ^+ I
<meta charset="UTF-8">3 S' Z& K" g% _# r( l, U
<meta name="viewport" content="width=device-width, initial-scale=1">
% t9 K g; a6 V5 B4 ~! k+ z
<title>Document</title>
; n C5 G" Z: E' r
</head>+ G; j2 B- W- n1 R' u7 Y
<body>6 X3 c! Z( T+ O5 D
<script data-cfhash='f9e31' type="text/javascript">
0 P$ Z; k! ?' D3 P
function jsCopy(){
# r& m8 Q& m- O2 r6 `
var e=document.getElementById("copy-num");//对象是copy-num12 ~4 T9 {. Y3 k' [
e.select(); //选择对象# R n \3 |2 x! h( J) [- F
document.execCommand("Copy"); //执行浏览器复制命令
' f ]+ w: F3 j4 U$ l
alert("复制成功");
1 E; p& I, z8 n! P" Y1 X$ J; ?
}
9 e4 P1 } c# c9 {
/* <![CDATA[ */4 L8 `/ ?% w4 j% @& E3 s/ R; y
!
" S! D8 n0 f8 h1 ]' i4 G
function() {6 X: J% a( J6 M: j. z
try {+ ]! T+ U; Y. d% j3 ~
var t = "currentScript" in document ? document.currentScript: function() {7 Y6 y3 [" E9 N+ s
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]
. Z) z* }8 ?1 D0 `
} ();
! F3 F& N; W/ f8 U8 Q. s
if (t && t.previousSibling) {
' c7 m. I% W) {+ p$ h. S
var e, r, n, i, c = t.previousSibling,
. p0 c" h& \4 s% K" i+ r: V1 G; Y
a = c.getAttribute("data-cfemail");
# J# {1 q3 Z4 D' D# G: n0 J
if (a) {
9 Z( }& y* F. N6 u9 W! T" D
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,; L& u) a' R0 g0 o i; l6 Y6 ^
e += String.fromCharCode(i);
~! a& I E+ P+ h) G1 z: S2 Y5 |
e = document.createTextNode(e), r4 _/ O8 w, e6 p+ o8 M2 `
c.parentNode.replaceChild(e, c)
& i, J' g3 b* V* a& L8 _
}
|' u* x1 v! O: H
t.parentNode.removeChild(t);' D+ m0 H5 Y6 P$ L a4 H
}
( g% ?% W, h$ O7 d9 [
} catch(u) {}3 Y, s5 U h* Z* d7 W% h. n
} ()
: c7 x; V: H) v
/* ]]> */. ^/ e2 H" e6 u4 \% `
9 R! k+ Y; N. ]; {& h2 Y2 I8 j/ Z
</script>8 h1 O' T/ z$ U9 A- x& W
<div class="nav navbar-top-links navbar-right">
8 U1 W! x3 j4 J' x7 t1 c5 E
<li>推广链接：</li>) I d4 D. {2 z' G
3 |+ ]& [) [3 I$ Y* @+ ^# }
<li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>
# @* ]4 w c+ M7 d" y0 j
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>' _5 V& l/ W) B. O, f4 i% A& J
* R, R6 T% E+ }' C
</div>
% u% B2 C r) G) d4 {% _* o
</body>
4 V1 M2 r3 N0 O& M8 J3 e
</html>* b# w+ D" E( H9 |5 S) Q9 ^' W

复制代码

案例二：

<html>1 b$ U9 N, i5 s% c
<head>: n% w; v6 ]+ u0 n
<meta charset="UTF-8">
! h& e4 i5 k5 S* m
<meta name="viewport" content="width=device-width, initial-scale=1"># d( L: L/ f3 r( `% ~
<title>Zero Clipboard Test</title>
+ F" z5 f- N [; B
</script>
1 N1 Z7 y( l0 w2 v& [
</head>3 a& _/ r; N0 m6 R+ G- J
<body>
( z9 p3 E) _, @- T1 X1 V
<script type="text/javascript">
; l0 z0 F2 I1 ?. G, H
function jsCopy(){ & W* G9 m7 N+ G3 J2 s. i
var e=document.getElementById("contents");//对象是contents
. F) n# a: Z/ S0 X+ F
e.select(); //选择对象 - {: ~4 I5 e9 ~% d( _- F7 k+ t1 N
tag=document.execCommand("Copy"); //执行浏览器复制命令+ l3 B1 u6 b& A: b6 d9 |
if(tag){
7 R9 A5 F" a% W$ A! T' } x
alert('复制内容成功');8 \4 p7 c, Q$ ^" ?: Q, I: E/ }& S. z
}
/ n* h* K5 i- @$ h
} " E g6 u: l* ~
$ C0 b9 Q( [4 I$ y
</script>
7 }. S) I r8 f% q( p$ `% Z e
<textarea id="contents" cols="40" rows="5"></textarea>
/ g; v# A6 L! S/ T6 f
<br />
! X9 U' @7 x7 P% F
<input type="button" onClick="jsCopy();" value="复制" />' C- ^9 {. {% n- H6 P. C
</body>8 ^* J9 ~, I: t" H& D
</html>; K( }0 ]* z- _, W) C. X8 X# O

复制代码

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

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

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