我在内部网页面上有一个部分,允许员工对客户门票进行跟进的摘要视图。我们添加了一键式事件来删除特定记录,方法是单击每行末尾的标准关闭图标(包含类.fudel)和(value =“####”)。删除由PHP通过POST事件处理。我使用相同的Jquery启动删除,在发送POST后重新加载摘要DIV,以便摘要列表是最新的。
问题是事件只会在.load()发生后触发一次Jquery无法再检测到动态div中的点击事件。如果你看一下我使用的Jquery,它使用.on()方法,据我所知,它取代了.live(),专门用于处理动态加载元素中的事件检测。
$('.fudel').on("click", function() {
var m = $(this).attr("value");
var answ = confirm("Press OK to DELETE follow-up record for: ("+ m +")");
if (answ == true) {
$.post("includes/phpfunctions.php", {
fudelete: m
});
$("#followup").load(location.href + " #followup > *");
}
else {
$.alert('Deletion Canceled', 'User Notice');
}
});
此外,在最近的两个问题中,我发现其中一些事件检测问题徘徊在需要添加第二个,第三个,第四个等等.Jquery调用on()事件的“回调”。如果这最终成为问题的解释,我会请某人提供一个很好的文档链接,解释Jquery操作何时需要在回调范围内 >>它可以/应该下降<回调范围的强>外。
答案 0 :(得分:6)
如果load()
函数正在替换表的内容(包括.fudel
元素),则需要使用委托事件处理程序。试试这个:
$('#followup').on('click', '.fudel', function() {
var m = $(this).attr("value");
var answ = confirm("Press OK to DELETE follow-up record for: ("+ m +")");
if (answ == true) {
$.post("includes/phpfunctions.php", {
fudelete: m
});
$("#followup").load(location.href + " #followup > *");
}
else {
$.alert('Deletion Canceled', 'User Notice');
}
});
请注意,click
事件现已绑定到#followup
元素,并委托给任何子.fudel
元素。
答案 1 :(得分:3)
尝试委托活动,因为如果你这样做:
$('.fudel').on("click", function() {
如果此元素存在,它会将事件附加到.fudel
,但如果DOM加载中不存在,则可以执行以下操作:
$('body').on("click", ".fudel", function() {
通过这种模式,您可以定位将来可能存在的元素,但不需要在DOM准备就绪。