javascript ile html düğmesi oluşturma onClick ile arama yapın tek param ile bir yöntem arayın

Question

javascript vía ajax'dan html düğmeleri oluşturuyorum. Bir html düğmesine bastığımda ajax işlevini çağırır. ajax başarılı olursa, for döngüsünde kullanılacak bir sayı alır. Döngü başlatılacak ve her yinelemede, aynı yöntemi çağıran onclick özelliği ile ancak farklı sayıda param ile bir html düğmesi oluşturulur. Üçüncü tekrarda ise, o zaman c == 2 ve param ikiye eşit olacaktır:

function getCampaign(campIndex){ 
    $.ajax({ 
     url : '../controller/ajaxController.php', 
     type : 'POST', 
     data : { 
      action:'setCampaign', 
      campIndex:campIndex, 
     }, 
     success : function(data) { 
      alert('campaign index: '+campIndex); 
     }, 
     error: function(XMLHttpRequest, textStatus, errorThrown) { 
      alert ('error: ' + textStatus + ' errorThrown: ' + errorThrown); 
     } 
    }); 
} 

Tüm düğmeler ediliyor:

function doAdCashAjax(){ 

    $.ajax({ 
     url : '../controller/ajaxController.php', 
     type : 'POST', 
     data : { 
      action:'getNumber' 
     }, 
     success : function(data) { 
      //Creates a button for each campaign 
      for(var c = 0;c<data;c++){ 

       var btn = document.createElement('input'); 
       btn.setAttribute("id", "Campaign "+c); 
       btn.type = "button"; 
       btn.setAttribute("value","Campaign "+c); 
       btn.setAttribute("name",c); 
       btn.addEventListener('click', function(){ 
        getCampaign(c); 
       }); 
       document.body.appendChild(btn); 

      } 
     }, 
     error: function(XMLHttpRequest, textStatus, errorThrown) { 
      alert ('error: ' + textStatus + ' errorThrown: ' + errorThrown); 
     } 
    }); 
} 

Bu html düğmeleri artık çağrısında bulunuyorlar yöntemdir başarıyla oluşturuldu, ancak onlara tıkladığımda, başarılı bir ajax alıyorum ve uyarı çıktıları her zaman indeks = 10 bastığım düğme. Burada, işlev çağrısında doğru parametreyi ayarlamak için nasıl yapılacağını sormak istiyorum, çünkü farklı params ile farklı düğmelerden işlevi çağırmam gerekecek.

doAdCashAjax() içinde data değeri neden isteğe bağlı olarak getCampaign(campIndex) çıkışlarını 10 anlamak isterim. Ayrıca isteğe bağlı olarak ancak hoş geldiniz, dinamik olarak oluşturulmuş html düğmelerini görmek için denetçiyi kullandığımda, kimliği, türü, değeri ve ad özelliklerini ancak hiçbir zaman onClick özelliğini göremiyorum.

Çok teşekkürler!

Answer 1

Bu sorun, scope hakkındadır. Tüm tıklama etkinliği işleyicileri en son c değerini alır.

for(var c = 0 ; c<11; c++) 
{ 
    .... 
    makeFunc(btn, c); 
    .... 
} 
function makeFunc(btn, c) 
{ 
    btn.addEventListener('click', function(){ 
     getCampaign(c); 
    }); 
} 

Örnek: https://jsbin.com/wecujoburu/edit?js,output

Bu şekilde yapmalıdır