Новые элементы, добавленные с помощью AJAX не работает с .on

Question

У меня есть следующий код:

$(".add_rows").on("click", function() { 
    alert('in here'); 
    $.post("add_row.php", function(data) { 
     $("#add_row_here").append(data); 
    }); 
}); 

В моем выходе PHP У меня есть следующие:

<a class="btn small fr add_rows" id="formsubmitswitcher">Add Rows</a> 

Я думал, что команда .он будет еще разрешите мне щелкнуть эту ссылку и снова запустить этот код. Почему это не работает, как я ожидал?

Answer 1

Вы можете попробовать делегирование событий с помощью .on()

$("#add_row_here").on("click",".add_rows" function() { 
    alert('in here'); 
    $.post("add_row.php", function(data) { 
     $("#add_row_here").append(data); 
    }); 
}); 

Синтаксис

$(closest-parent-element).on(event,"selector" function() {}); 

вместо документа вы можете использовать ближайший родительский элемент