jquery remove parent nie działa na dynamicznie utworzonych divs

Question

im próbuje użyć jquery, aby przycisk usunąć jego div div.

mój znaczników:

<div class="web_store_fields" id="web_store_input1"> 
<p> 
<label for="web_store_address[]" >Store Address : </label>   
<input name="web_store_address[]" class="web_store_info" type="text" value="http://www." size="35"/> 
<input class="button_remove_web_store" type="button" value="Remove" /> 
</div> 

jQuery Kod usuwanie div:

$('.button_remove_web_store').click(function() { 
$(this).parents("div:first").remove(); 
}); 

to działa ok dla div że w html, gdy strona się ładuje, ale nie dla div tworzone dynamicznie przez użytkownika (przy użyciu tego kodu jQuery):

$('#button_add_web_store').click(function() { 
var num = $('.web_store_fields').length; 
var newNum = new Number(num + 1);  
var newElem = $('#web_store_input' + num).clone().attr('id', 'web_store_input' + newNum); 
$('#web_store_input' + num).after(newElem); 
}); 

dla jasności, dynamika tworzenie działa dobrze, problemem jest usunięcie tych elementów div.

jakieś wskazówki byłyby wysoko ceniona

Answer 1

Użyj obsługi delegowanych (on) z klasy jako selektora tak, że wszelkie nowe przyciski, które zostaną dodane później będą nadal działać.

$('body').on('click', '.button_remove_web_store', function() { 
    $(this).parents("div:first").remove(); 
}); 

Answer 2

Nie użyć live obsługi - została zaniechana w jQuery 1.7 i usunięte w jQuery 1.9 - rozdzielanie zmian dla bardzo wielu ludzi.

Zamiast korzystać z obsługi on, który jest zalecany sposób teraz:

$(document).on('click', '.button_remove_web_store', function() { 
    $(this).parents("div:first").remove(); 
}); 

Answer 3

Niedawno został uruchomiony do problemu z $.on() że niejasne i bardzo podobna do tej aplikacji, jak najbardziej „Usuń ten jest dominująca” funkcje są.

Aby zilustrować przykład na to pytanie jest:

$('.web_store_fields').on('click', '.button_remove_web_store', function(e){ 
    $(this).parent().remove(); 
}); 

wielki połów tutaj jest drugi parametr. należy wybrać kontener $('.container') i przekazać selektor elementów "przycisku" jako drugi parametr funkcji .on. więc definicja (w pewnym sensie)

$('.container').on('click', '.myremovebutton', function(e){ 
    $(this).parent().remove(); 
});