在添加動態元素時刷新JQuery選擇器

Question

在下一個代碼中，我使用AJAX調用php腳本，然後使用JSON響應更新#inner_div。隨着這個，#gimme_moar按鈕被注入到#inner_div，所以我添加了點擊處理程序來詢問更多結果。

因此，我們將再次使用ajax調用相同的PHP腳本，然後我們將APPPEND對#inner_div的一部分#tabla的JSON響應。

一切都按預期工作，但有一件事... $(".faulty_selector")正在工作的第一個50「行」...如果我不斷添加「行」，他們將不會與$(".faulty_selector")捆綁，如果我再次添加此處理程序它會重複自己，最後執行$(".faulty_selector")，因爲我們點擊了#gimme_moar按鈕。

$.ajax({ 
type: "POST", 
url: URL, 
data: { 
    data1: '1', 
    data2: 2, 
    data3: 3 
}, 
dataType: "json", 
timeout: 25000, 
success: function (data) { 
    var counter = 50; 
    $('#inner_div').html(data.answer); 
    $(".faulty_selector").on('click', function() { 
     myfunction_action(this.id); 
    }); 
    $("#gimme_moar").click(function() { 
     $.ajax({ 
      type: "POST", 
      url: "URL", 
      data: { 
       data1: '1', 
       data2: 2, 
       data3: 3 
      }, 
      dataType: "json", 
      timeout: 25000, 
      success: function (data) { 
       counter = counter + 50; 
       $('#tabla').append(data.datos); 
      } 
     }); 
    } 
    }); 

根據大量的脂肪酶，生活（）或（）應該能夠處理這種情況沒有任何問題......但在這一點上我使用（「集團公司」，等等等等），它不工作...

有什麼辦法刷新/重新綁定50個新的$(".faulty_selector")？

Answer 1

代表事件

變化

$(".faulty_selector").on('click', function() { myfunction_action(this.id); }); 

到

$(document).on('click', ".faulty_selector", function() { myfunction_action(this.id); }); 

並移動click事件到ajax方法之外。否則，您將綁定發送事件ajax請求的相同事件。

也似乎錯過了ajax的大括號。

$.ajax({ 
    type: "POST", 
    url: URL, 
    data: { 
     data1: '1', 
     data2: 2, 
     data3: 3 
    }, 
    dataType: "json", 
    timeout: 25000, 
    success: function (data) { 
     var counter = 50; 
     $('#inner_div').html(data.answer); 
    } 
}); 

$(document).on('click', ".faulty_selector", function() { 
    myfunction_action(this.id); 
}); 
$(document).on('click', "#gimme_moar", function() { 
    $.ajax({ 
     type: "POST", 
     url: "URL", 
     data: { 
      data1: '1', 
      data2: 2, 
      data3: 3 
     }, 
     dataType: "json", 
     timeout: 25000, 
     success: function (data) { 
      counter = counter + 50; 
      $('#tabla').append(data.datos); 
     } 
    }); 
});