[英]on click event won't fire after AJAX filter manipulates the DOM
我正在一个具有AJAX过滤器的电子商务网站上,该过滤器根据每个产品属性来操纵dom。
我正在编写另一个AJAX调用,以在单击时在每个产品上提取更多产品属性。
这是我的AJAX电话
$('.each-product').on('click', function (e) {
/** Prevent Default Behaviour */
e.preventDefault();
/** Get Post ID */
var post_id = $(this).attr('id');
var response_class = '.' + post_id + '-ajax-response';
/** Ajax Call */
jQuery.ajax({
type: 'POST',
url: ajaxurl,
data: { action: 'product_extra_info', id: post_id },
beforeSend: function () {
$(response_class).show().html("Loading...");
},
success: function (data) {
$(response_class).show().html(data);
//alert(data);
}
});
return false;
});
见.on
事件的代表团。 通过click
您无法绑定到动态添加到DOM的内容。 切换代码中使用on
将是这样的:
$('.products').on('click', '.each-product', function (e) {
/** Prevent Default Behaviour */
e.preventDefault();
/** Get Post ID */
var post_id = $(this).attr('id');
var response_class = '.' + post_id + '-ajax-response';
/** Ajax Call */
jQuery.ajax({
type: 'POST',
url: ajaxurl,
data: { action: 'product_extra_info', id: post_id },
beforeSend: function () {
$(response_class).show().html("Loading...");
},
success: function (data) {
$(response_class).show().html(data);
//alert(data);
}
});
return false;
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.