zoukankan      html  css  js  c++  java
  • js复制兼容:ZeroClipboard复制到剪切板(支持IE、FF、Chrome)

    注意:ZeroClipboard在本地测试无法直接使用,必须在服务器上测试,如http://localhost... 

    准备:ZeroClipboard.swf 和 ZeroClipboard.js

    小示例:单用

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>复制</title>
    </head>
    <script type="text/javascript" src="ZeroClipboard.js"></script>
    <body>
    <input type="submit" name="btn_copy" value="复制" id="btn_submit" />
    <script type="text/javascript">
    var clip = new ZeroClipboard.Client();
    clip.setHandCursor(true);
    clip.setText("要复制的文本");
    clip.glue("btn_submit");
    </script>
    </body>
    </html>

    下载Demo>>>>>>>>>

     通用版:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>通用..</title>
    </head>
    <body>
    text: <input type="text" name="text" value="copy ok!" id="text"/>
    <input type="submit" name="btn_copy" value="复制" id="btn_submit"/>
    <script type="text/javascript" src="ZeroClipboard.js"></script>
     
    <script type="text/javascript">
    copyToClipboard('text','btn_submit');
    function copyToClipboard(txt,id){
    var clip = new ZeroClipboard.Client();
    clip.setHandCursor(true);
    var text= document.getElementById(txt).value;
    clip.setText(text);                    
    clip.glue(id);
    clip.addEventListener( "complete", function(){
        alert("复制成功!");
    });
    }
    </script> 
    </body>
    </html>

    jq:zclip复制

    ZeroClipboard官网

    更多功能>>>

  • 相关阅读:
    08简单推导:手机尾号评分
    07简单推导:生日蜡烛
    06普通推导
    05简单推导:猴子吃桃
    简单推导
    03map用法
    List题目
    02List的使用
    01基础知识
    HDU
  • 原文地址:https://www.cnblogs.com/tinyphp/p/3307522.html
Copyright © 2011-2022 走看看