cncml手绘网

标题: 点击按钮复制到剪贴板 js [打印本页]
作者: admin    时间: 2018-7-31 10:14
标题: 点击按钮复制到剪贴板 js
  1. <blockquote><span style="font-family: Arial, Helvetica, sans-serif;">案例一：</span>
复制代码
  1. </pre><pre code_snippet_id="1755225" snippet_file_name="blog_20160711_1_4917192" name="code" class="html"><!DOCTYPE html>/ c1 Y. [. Y4 h3 _9 _; g1 j6 }
  2. <html lang="en">6 m! w+ ^/ I1 y; k
  3. <head>+ V3 s9 q. W3 d, U, X5 v; |" G8 K
  4.         <meta charset="UTF-8">
    2 M! o+ B; Y/ S" P3 t; f! g
  5.         <meta name="viewport" content="width=device-width, initial-scale=1">: `8 ^1 P. O5 g" e3 U4 T& B
  6.         <title>Document</title>* N( [6 z# c4 c1 \
  7. </head>
    & \* ^0 |7 s, ]. Z. z" m/ ]! ]9 e
  8. <body>, Z% R( A$ b8 [) L: U2 P
  9.         <script data-cfhash='f9e31' type="text/javascript">
      s8 C( j: D9 c: i
  10.                   function jsCopy(){. W6 L# \# w: ?
  11.                     var e=document.getElementById("copy-num");//对象是copy-num1
    * H; v* t. X9 S  H# v% a7 |
  12.                     e.select(); //选择对象
    * J. F* |' b$ m8 `6 `
  13.                     document.execCommand("Copy"); //执行浏览器复制命令
    0 `: q1 V$ S' ?$ X4 h
  14.                     alert("复制成功");
    * @$ H" \' S7 L, h& K0 m" Q
  15.                 }8 d* L1 Y0 \/ D) f
  16.                   /* <![CDATA[ */7 e/ M) S, f: x: t/ o. E
  17.                   !
    # y) P1 H5 P/ J' ?  k5 o
  18.                   function() {
    9 S6 @3 {& z( }. x6 W) N
  19.                     try {$ ?% b4 ]6 @$ `' v
  20.                       var t = "currentScript" in document ? document.currentScript: function() {! ~: {0 [: s1 J% a
  21.                         for (var t = document.getElementsByTagName("script"), e = t.length; e--;) if (t[e].getAttribute("data-cfhash")) return t[e]
    8 A: h9 i$ _# x
  22.                       } ();
    3 D+ f9 |" s3 e( K! T
  23.                       if (t && t.previousSibling) {
    ; H5 T$ E4 |6 o% ~
  24.                         var e, r, n, i, c = t.previousSibling,
    . M" s  {2 ~( L( q5 t6 p
  25.                         a = c.getAttribute("data-cfemail");* I5 S3 D1 G. A9 S( t- n5 u
  26.                         if (a) {
    . U& e  P. h- Z& K- J/ X+ s
  27.                           for (e = "", r = parseInt(a.substr(0, 2), 16), n = 2; a.length - n; n += 2) i = parseInt(a.substr(n, 2), 16) ^ r,
    / y0 q$ b& x* n* Y; U7 G8 U/ p
  28.                           e += String.fromCharCode(i);
    % Q' }# F% D- @5 L4 S( |7 x
  29.                           e = document.createTextNode(e),- [6 K" R- d0 u$ V( L2 S
  30.                           c.parentNode.replaceChild(e, c)% W+ t2 h* X; c
  31.                         }' [3 F7 k2 l' z' t
  32.                         t.parentNode.removeChild(t);
    ) K/ B" j  q) W
  33.                       }/ R' d! y7 Y( e* L$ S) k- y% Y
  34.                     } catch(u) {}
    8 G, `+ y1 r$ ]* F! D3 ]  M' Z
  35.                   } ()/ C$ v# |3 W$ U+ L
  36.                   /* ]]> */
    # _1 M- J* v$ V0 s7 P3 n" I5 Q
  37.                   " k: W" y' C' u" k6 D
  38.                 </script>
    . d' h+ R& L+ e) P; g3 Y
  39.                                  <div class="nav navbar-top-links navbar-right"># F$ S1 {7 \8 k, w! G3 P, u3 e9 ^# }
  40.                   <li>推广链接：</li>& o2 e7 W0 H# x- Y
  41.                  $ q) s* x, ~; \5 b  o/ i$ `
  42.                     <li><input id="copy-num" class="form-control" type="text" value="" style="max-width:100px;display:inline-block;color: #999; margin-top:12px"></li>& T7 M; a1 p4 e/ L
  43.                     <li><button onClick="jsCopy()" type="button" class="btn btn-sm">复制</button></li>
    $ }* Q1 D4 D, N8 ~
  44.                  1 t: y; A; P' ]- N
  45.                 </div>* Z/ V& N1 g1 R& {+ a) x& r0 \
  46. </body>4 o1 w) P" N& V# u# H8 ~2 E( U
  47. </html>
    4 M5 E4 q" p3 D8 z$ |& }1 O
复制代码
案例二：
9 n6 s! @2 K4 c$ x# m( E- ~; ~
  1. <html>/ F: i& U9 r9 g" R  v9 b
  2. <head>0 M9 t/ U! K5 e# K$ G- {
  3.         <meta charset="UTF-8">3 [5 M: @) w- H( Y5 x8 P
  4.         <meta name="viewport" content="width=device-width, initial-scale=1">2 B$ k$ g/ H$ \" o% Q' k
  5.         <title>Zero Clipboard Test</title>5 [/ ]4 F2 k% H4 s: l
  6. </script>! `8 G- _& J+ h2 {1 h5 o
  7. </head>  O" E- Y4 R: ]8 i3 N9 ]: z
  8. <body>
    ( D* o0 z. r7 A
  9.    <script type="text/javascript"> ; S) Q3 j  r5 k* p8 Y
  10.     function jsCopy(){
    & g( H% c  s1 X% N/ ]
  11.         var e=document.getElementById("contents");//对象是contents
    ' J. ^. a+ w# d7 k9 Q( E1 E
  12.         e.select(); //选择对象
    # p+ X) c7 r# y
  13.         tag=document.execCommand("Copy"); //执行浏览器复制命令/ C5 c/ ?+ b2 s* \9 C
  14.         if(tag){
    $ U6 X% u4 N1 d% V5 y4 l
  15.                 alert('复制内容成功');: e6 |- P. c0 |( M# u0 m) d: M
  16.         }  p1 x2 B. t. b" {: s* M9 w6 C, h
  17.     }
    2 `4 d/ A) V6 x( Y3 V3 v

  18. & \! v2 H! {, Y" y0 h! y8 I* e8 l
  19. </script>
    & ~) O$ d! w8 ]% x) U  a5 F" y7 v! A
  20. <textarea id="contents" cols="40" rows="5"></textarea>
    , p9 A7 U, f3 W8 e
  21. <br />
    ( C9 j- I5 s5 \  }" Z% K
  22. <input type="button" onClick="jsCopy();" value="复制" />1 L( P5 v* D) \( N# z
  23. </body>1 z: r5 j+ z) u+ N& j8 r4 s; ]% O
  24. </html>, M6 ?2 [) z7 _  U( T' K% b
复制代码
以上都可以执行，亲自测试！
& D% a2 z' Q, b



欢迎光临 cncml手绘网 (http://bbs.cncml.com/) Powered by Discuz! X3.2