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>