Javascript динамический varible в $ .each заявление

Question

У меня есть каталог предметов, которые все показаны через в то время как петля все элементы имеют описание, которое может быть скопирован с ZeroClipboard плагин.

мне нужно сделать код ниже создать клиент для каждого из .itemDescriptionContainer «с. Поэтому я копирую правильные данные.

Я создал атрибут с идентификатором элемента, содержащего описание .itemDescriptionContainer

---

Текущий код - я пытался (и не работает)

HTML

//While Loop 
<div class="itemDescriptionContainer"> 
    <div id="copy-button" data-clipboard-target="copyDescription">Copy Description<div> 
    <div id="copyDescription"> 
</div> 
//endwhile 

Javascript

$(".itemDescriptionContainer").each(function(index){ 
    var client = new ZeroClipboard(document.getElementById("copy-button")); 

    client.on("ready", function(readyEvent) { 
     client.on("aftercopy", function(event) { 
      event.target.innerHTML = "Description Copied!"; 
     }); 
    }); 
}); 

---

* Следующий код вроде работает, это только копирует описание первого элемента в whileloop

HTML

//While Loop 
<div class="itemDescriptionContainer" data-itemID="{{{$item->id}}}"> 
    <div id="copy-button-{{{$item->id}}}" data-clipboard-target="copyDescription-{{{$item->id}}}">Copy Description<div> 
    <div id="copyDescription-{{{$item->id}}}"> 
</div> 
//endwhile 

Javascript

var itemID = $(this).attr('data-itemID'); 
    // Attach itemID to client somehow to make a client instance unique. 

    var client = new ZeroClipboard(document.getElementById("copy-button")); 

    client.on("ready", function(readyEvent) { 
     client.on("aftercopy", function(event) { 
      event.target.innerHTML = "Description Copied!"; 
     }); 
    }); 

Answer 1

Я исправил проблему с использованием оконной функции, я надеюсь, что некоторые из них могут найти это полезным.

$(".itemDescriptionContainer").each(function(){ 
    var itemID = $(this).attr('data-itemID'); 

    // Copy Item Description 
    var dynamic = window["client" + itemID] = new ZeroClipboard(document.getElementById("copy-button-"+itemID)); 

    dynamic.on("ready", function(readyEvent){ 
     dynamic.on("aftercopy", function(event){ 
     event.target.innerHTML = "Description copied!"; 
     }); 
    }); 

});