我正在开发一个电子商务网站,该网站具有 AJAX 过滤器,可以根据每个产品属性操作 dom。
我正在编写另一个 AJAX 调用,以便在点击时提取每个产品的更多产品属性。</p>
Here is the link to the dev site
这是我的 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
您无法绑定(bind)到动态添加到 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;
});
关于php - AJAX 过滤器操作 DOM 后,单击事件不会触发,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28006402/