cncml手绘网
标题:
点击按钮复制到剪贴板 js
[打印本页]
作者:
admin
时间:
2018-7-31 10:14
标题:
点击按钮复制到剪贴板 js
<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>
/ n$ d1 l% a/ l8 G
<html lang="en">
) Q( z5 L" K5 t/ U+ ~
<head>
, E$ P7 @$ h8 z x" T
<meta charset="UTF-8">
/ ~$ l/ v- a+ Q; }. b, E9 s2 Y( H+ t
<meta name="viewport" content="width=device-width, initial-scale=1">
) I8 p" I+ X. u% O! j0 N8 e" b4 m2 f
<title>Document</title>
# N% D; C" p# v4 l Y
</head>
0 D3 V$ Z: A; D( `8 y G/ F
<body>
+ J) U' r/ Q0 c7 z2 C8 {! s, f
<script data-cfhash='f9e31' type="text/javascript">
1 M! e1 j- Z' q* P a
function jsCopy(){
7 g* q$ X3 a+ [
var e=document.getElementById("copy-num");//对象是copy-num1
8 Y$ f e6 I1 M1 d" A
e.select(); //选择对象
9 Z% M, [- F$ I: R2 K2 K
document.execCommand("Copy"); //执行浏览器复制命令
: Y) h" q0 `8 k( Q/ L( q0 w C6 }
alert("复制成功");
9 n, \, y! g/ o# x4 c+ [
}
" f9 i: V* d& i* Z h' g
/* <![CDATA[ */
; }3 P0 l8 e( L3 B, m: h
!
/ |/ x' r$ C# G3 C0 X
function() {
7 b( l5 m7 W; I- h
try {
4 [4 t0 W2 G& P
var t = "currentScript" in document ? document.currentScript: function() {
: `# N9 B( G; |+ q w/ z
for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]
) M# j; q* c$ v7 \0 I6 j
} ();
4 p* H! }1 O+ o# X
if (t && t.previousSibling) {
V4 G2 e' ~8 N/ W
var e, r, n, i, c = t.previousSibling,
9 |9 P' Q' J* s; f1 n% h
a = c.getAttribute("data-cfemail");
5 K$ Z2 A0 h9 I, }) E
if (a) {
; k0 `9 g9 V. _/ _
for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,
4 T- C- C& {) H3 j
e += String.fromCharCode(i);
9 Q. Z0 _0 n; `
e = document.createTextNode(e),
1 C- @% o$ Q4 I% q6 n2 M6 t
c.parentNode.replaceChild(e, c)
$ s( E5 u+ C6 A( d: q* w: O% H+ Y
}
7 L7 y3 l# Y' m2 I2 e1 c& p) T
t.parentNode.removeChild(t);
- K Z7 X' s; ^3 Z: d0 U; D6 o
}
O# ? ~ A' v% M, |8 v8 y
} catch(u) {}
% N9 o- s! }. F2 ?) h" B& X
} ()
, z+ E7 [8 J+ t$ f4 n0 {$ {$ n
/* ]]> */
- x' v* p" }& o' y
+ S" C# N' N- G9 ^8 |
</script>
2 ~# W9 w9 `4 m
<div class="nav navbar-top-links navbar-right">
|" o% P0 p& Z' z0 Q8 H
<li>推广链接:</li>
& R* }4 s. w3 y8 U# X& B
+ v4 M8 u0 X: K+ |3 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 R/ \9 J+ ~2 C6 C$ x, M
<li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>
7 _7 e% R: s3 \
- L( q6 G X3 j+ {
</div>
5 T/ }6 s! h1 k; d! D. i: o
</body>
- S/ }% }/ y) g9 |6 ?
</html>
% E8 J$ j# k4 g ?. y
复制代码
案例二:
3 x& }% R! u) T
<html>
* T6 \' D! X; |) U7 L
<head>
8 O5 {! X5 o5 Z+ b, d0 r$ Z
<meta charset="UTF-8">
% X$ S" u: U, _: ]; P, X
<meta name="viewport" content="width=device-width, initial-scale=1">
: A+ [2 X4 @# r) S! c U
<title>Zero Clipboard Test</title>
2 A% i- R6 P2 B3 y3 n
</script>
0 w6 v0 D2 M$ e" l4 Q; \
</head>
. W# U3 q, o% l/ g H' i( s4 k
<body>
' j, U. S" D3 d/ Y% C% x; n
<script type="text/javascript">
) k: H" ?! f4 X- m# z% v% @; z; \
function jsCopy(){
6 l# K# u( B$ d/ K
var e=document.getElementById("contents");//对象是contents
' m& _2 A+ \7 e1 b) q
e.select(); //选择对象
1 Y$ O; d0 {: I, F0 A
tag=document.execCommand("Copy"); //执行浏览器复制命令
2 w: v: B- z; o5 i! S+ v5 w; j
if(tag){
L W/ a z1 Y
alert('复制内容成功');
9 t! a% q7 h/ P4 m" C6 ?
}
+ v, w! n0 y& s) x' }
}
9 ^% `* _) o9 ^& l( X# X! P( m
- J, w. f" J/ r% H
</script>
6 p" ^( w: }+ N$ D% S3 L# M
<textarea id="contents" cols="40" rows="5"></textarea>
3 h' `% f4 T. F
<br />
" _$ t2 q' J# [* o( n- t1 \
<input type="button" onClick="jsCopy();" value="复制" />
6 C6 ~9 x) T: o: E
</body>
& S2 y2 _( ?7 D8 q p5 r' H
</html>
8 b- d; A+ b0 y& b9 g7 O
复制代码
以上都可以执行,亲自测试!
/ O+ p! N; p+ z
欢迎光临 cncml手绘网 (http://cncml.com/)
Powered by Discuz! X3.2