Как вызвать функцию после использования .loaddata

Question

Как вызвать функцию после использования .loaddata

Мне интересно, почему я не могу выполнить функцию jquery для кнопки, загруженной функцией .loaddata.

<div id="products"></div>

<script>
$(document).ready(function(event) {
loadData(1,'default');
});

function loadData(page,type){
var base = '<?php echo $sr_class->baseURL();?>';
$.ajax
({
type: "GET",
url: base+"includes/module/loadProduct.php",
data: {page:page,type:type},
success: function(msg)
{
console.info(msg);
$("#products").html(msg);
}
});
}
$('.addcart').click(function(e){
e.preventDefault();
var proid = $(this).attr('proid');
var base = '<?php echo $sr_class->baseURL();?>';
$.post(base+'includes/module/addtocart.php',{p_id:proid, p_qty:1},function(result){
location.reload();
})
});

</script>

msg возвращается из функции loadData:

<p><a proid="ABCD1001" class="btn btn-success addcart" role="button"> ABCD1001</a></p>

Когда я нажимаю кнопку, он не выполняет функцию.

0

jquery loaddata php

Решение

Другие решения

Других решений пока нет …

Источник

Accepted Answer

Это потому, что вы используете .click() вместо .on(), click() используемая привязка называется «прямой» привязкой, которая прикрепляет обработчик только к уже существующим элементам. Он не будет привязан к элементам, созданным в будущем. Для этого вам нужно создать «делегированную» привязку с помощью on(),

От документация .on():

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

Так что связывай .addcart элемент с .on() как это:

$(document).on('click','.addcart',function(e){
e.preventDefault();
var proid = $(this).attr('proid');

$.post('<?php echo $sr_class->baseURL();?>includes/module/addtocart.php',{p_id:proid, p_qty:1},function(result){
location.reload();
})
});

0