jQuery 绑定在 AJAX 调用后单击链接
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4842119/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery binding click to a link after AJAX call
提问by user398341
I'm getting furious - perhaps someone will be able to help me with this.
我很生气——也许有人能帮我解决这个问题。
I need to re-bind the click to the link after AJAX call, but for some reason it doesn't want to work.
我需要在 AJAX 调用后将点击重新绑定到链接，但由于某种原因它不想工作。
Here's my code:
这是我的代码：
if ($('.active').length > 0) {
$('.active').click(function() {
var elem = $(this);
var url = $(this).attr('href');
$.ajax({
url: url,
dataType: 'html',
success: function(data) {
elem.replaceWith(data);
}
});
$('.active').bind('click'); return false;
});
}
Any idea?
任何的想法？
Thanks for the responses - I've amended the code, but the problem is still there:
感谢您的回复 - 我已经修改了代码，但问题仍然存在：
function makeActive() {
if ($('.active').length > 0) {
$('.active').click(function() {
var elem = $(this);
var url = $(this).attr('href');
$.ajax({
url: url,
dataType: 'html',
success: function(data) {
elem.replaceWith(data);
}
});
$('.active').live('click', makeActive);
return false;
});
}
}
$('.active').live('click', makeActive);
回答by MD Sayem Ahmed
UPDATEon October 31, 2012
更新于2012年10月31日，
Starting from jQuery 1.7, the recommended approach is to use on-
从 jQuery 1.7 开始，推荐的方法是使用on-
$(document).on('click', '.active', function () {
// click handler code goes here
});
Can you try the following ?
您可以尝试以下方法吗？
$('.active').live('click', function()
{
// click handler
});
回答by Felix Kling
You would have to add the rebinding in the successhandler if you want to execute it afterthe Ajax call:
success如果您想在 Ajax 调用之后执行它，则必须在处理程序中添加重新绑定：
success: function(data) {
elem.replaceWith(data);
$('.active').bind('click', /* some function needs to go here*/);
}
That said, in this case, live()or delegate()are probably better options [update:now that jQuery 1.7 is out, everything can be done with .on()]. This would also prevent double assignment of click handlers, in case you have other .activelinks that have not been replaced.
也就是说，在这种情况下，live()或者delegate()可能是更好的选择 [更新：现在 jQuery 1.7 出来了，一切都可以用.on()]完成。这也可以防止点击处理程序的双重分配，以防您有其他.active未替换的链接。
Update:Regarding your updated code: The way you are using livedefeats its purpose. Please read its documentation. What you are doing is assigning a click handler when the the link is clicked, which means that you are adding click handlers over and over again.
更新：关于您更新的代码：您使用的方式live违背了其目的。请阅读其文档。您正在做的是在点击链接时分配一个点击处理程序，这意味着您要一遍又一遍地添加点击处理程序。
This is an improved version of your code.
这是您的代码的改进版本。
$('.active').live('click', function(event) {
var elem = $(this);
var url = $(this).attr('href');
$.ajax({
url: url,
dataType: 'html',
success: function(data) {
elem.replaceWith(data);
}
});
event.preventDefault();
event.stopPropagation();
});
