Zeroclipboard多個元素

Question

我在代碼中創建多個Zeroclipboard實例時遇到問題，每個實例在調用後都會彈出一個彈出窗口。

<a class="xxx" href="popup.url.php" ><span >FRSDE3RD</a> 
<a class="xxx" href="popup.url2.php" ><span >FRSDE3RD2</a> 
<a class="xxx" href="popup.url3.php" ><span >FRSDE3RD3</a> 
$(document).ready(function(){ 
    ZeroClipboard.setMoviePath('path/to/swf/ZeroClipboard.swf'); 
    // setup single ZeroClipboard object for all our elements 
    clip = new ZeroClipboard.Client(); 
    clip.setHandCursor(true); 

    // assign a common mouseover function for all elements using jQuery 
    $('a.xxx').mouseover(function() { 
     // set the clip text to our innerHTML 
     var url = $(this).attr("href"); 
     var code = $(this).children('span').html(); 
     clip.setText($(this).children('span').html());//this.innerHTML); 

     clip.glue(this); 
     clip.addEventListener('onMouseDown', function(){ 
      clip.reposition(this); 
      clip.setText(code); 
     }); 

     clip.addEventListener('onComplete', function(){ 
      clip.reposition(this); 
      popUp(url); 
     }); 


    }); 
}); 

function popUp(URL) 
{ 
    day = new Date(); 
    id = day.getTime(); 
    eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=1,scrollbars=1,location=1,statusbar=1,menubar=1,resizable=1,width=1024,height=768,left = 328,top = 141');"); 
} 

我就產生了複製到剪貼板功能的成功，但是如果我請使用onMouseUp，的onComplete事件觸發彈出功能，它無論是火象4-5彈出窗口或不火的。

P.S.我試圖修改How to load an Ajax response into clipboard using jQuery and ZeroClipboard?的解決方案，而不是ajax調用，只需複製到剪貼板，然後完成午餐彈出窗口......正如我所說的，沒有爲我工作。

當我啓用flashblocker的時候，我還發現了什麼？每當我翻轉一個CODE標籤時，同一個地方就會創建一個新的閃光燈，所以這可能是爲什麼我有3-4彈出的解釋點擊它。如果我滾動更多，彈出更多。有沒有辦法阻止閃光燈在同一地點製作或在推出時銷燬？

Answer 1

更多的研究後，我得到了我解決這個問題：

$("a.xxx").each(function() { 
    //Create a new clipboard client 
    var clip = new ZeroClipboard.Client(); 
    clip.setHandCursor(true); 

    //Glue the clipboard client to the last td in each row 
    clip.glue(this); 

    var url = $(this).attr("href"); 
    //Grab the text from the parent row of the icon 
    var code = $(this).children('span').html();  
    clip.setText(code); 

    //Add a complete event to let the user know the text was copied 
    clip.addEventListener('complete', function(client, text) { 
    //alert("Copied text to clipboard:\n" + text); 
    popUp(url); 
    }); 
}); 

是，如果任何人會陷在這個問題的解決方案。

Answer 2

嘗試使用http://www.steamdev.com/zclip/它允許您直接訪問jquery，並且可以在return語句中使用自己的邏輯。

包括jquery.zclip.js 下載並保存ZeroClipboard.swf

這裏是一個片段：

$(".class-to-copy").zclip({ 
    path: "assets/js/ZeroClipboard.swf", 
    copy: function(){ 
     return $(this).attr("data-attribute-with-text-to-copy"); 
    } 
}); 

確保您更改SWF文件的路徑。

Answer 3

安德烈C回答的是過時的。 只需按照以下步驟操作即可。

<a id="test1" class="test" href="#" data-clipboard-text="1">111</a> 
<a id="test2" class="test" href="#" data-clipboard-text="2">111</a> 
<a id="test3" class="test" href="#" data-clipboard-text="3">111</a> 
<script src="js/jquery-1.11.3.min.js"></script> 
<script src="dist1/ZeroClipboard.js"></script> 
<script> 
var client = new ZeroClipboard(); 
client.clip($(".test")); 

client.on("ready", function(readyEvent) { 
    client.on("aftercopy", function(event) { 
    alert("Copied text to clipboard: " + event.data["text/plain"]); 
    }); 
}); 

</script>