瀏覽器的複製到剪切板功能，兼容全部瀏覽器，懸浮層不能複製問題解決

      瀏覽器複製實際上是一個十分使人頭疼的問題，由於這涉及到瀏覽器安全，因此瀏覽器本生不會提供相應接口，咱們也沒有辦法經過純js來實現這個功能，可是你會看到不少網站，如百度雲盤他們卻作到了這個功能，那究竟他們是如何實現的，今天就讓我帶你去看看他們的祕密。

      首先這個功能對我是十分重要的，由於去轉盤網的私密分享必需要具有這個功能，截圖以下：

   

只要你點擊點我複製按鈕，網盤私密分享的密碼就會自動的被複制到你的瀏覽器。其實這個功能本人最開始作的時候仍是付出不少時間，由於他涉及到懸浮層的複製，問題的難度陡然增大許多，不過如今我仍是願意公開代碼，但願你們喜歡。順便我我指出其餘幾篇我寫的博客代碼，但願喜歡：

百度網盤爬蟲

百度圖片爬蟲

ok搜搜爬蟲源碼

java分詞算法

邀請好友註冊

數據庫自動備份

  好的，如今讓咱們言歸正轉，瀏覽器複製須要兩個插件，請先下載：下載地址1 下載地址2

  代碼以下：

var clip=null;
  clip = new ZeroClipboard.Client();//new 一個對像
  clip.setText(null);
  ZeroClipboard.setMoviePath( '${pageContext.request.contextPath}/media/js/ZeroClipboard.swf');  //和html不在同一目錄需設置setmoviepath
  //ZeroClipboard.setMoviePath( '../media/js/zeroclipboard10.swf');
  clip.setHandCursor(true);
  clip.addEventListener('mousedown', function(client) {
        
      window.passwd = document.getElementById("file-password").value;
      clip.setText(window.passwd);
  });
    
  clip.addEventListener('complete', function (client, text) {
    
        window.url = document.getElementById("file-url").value;
        var id=get_param("id");
        var type=get_param("type");
        window.open(window.url,'_self');
        $('.theme-popover').hide();
        $('.theme-popover-mask').hide();//將複製框dismiss
        document.getElementById("theme-popover").style.visibility="hidden";//影藏
        //記錄下載信息
        $.ajax({
                    type: "post",
                    url: "${pageContext.request.contextPath}/download/statistic.action",
                    dataType:"json",
                    data:{
                            id:id,
                            type:type
                    },
                    success:function(data){;}    
         });
  });
  clip.glue('copy-password','copy-dialog');

代碼中的記錄下載信息等都是和去轉盤網有關係，你沒必要關心，下面一句：

document.getElementById("theme-popover").style.visibility="hidden";//影藏

很是重要，由於要懸浮層複製，若是是相對佈局flash是找不見覆蓋按鈕的，因此開始的時候

document.getElementById("theme-popover").style.visibility="visible";//私密分享時顯示

最後要影藏。