我想使用 jQuery 的 .delegate() 方法，因为我读到它的性能比 .live() 好得多。
但是，当我使用 .delegate() 时，它不会将事件绑定(bind)到 ajax 加载的内容。
任何人都可以帮助我让 .delegate() 工作吗？或者我是否坚持使用较慢的 .live() 来加载 ajax 内容？
var randomObject = {
'config' : {
'form' : '#someform',
'select' : '#someselect',
'container' : '#pagecontainer'
},
'init' : function() {
randomObject.formEffects();
randomObject.ajaxFormSubmit();
},
'formEffects' : function() {
////////////// DELEGATE WON'T WORK on AJAX loaded content!
//$('randomObject.config.form).delegate('select', 'change', function() {
$(randomObject.config.select).live('change', function() {
$(this).closest('form').trigger('submit');
});
},
'ajaxFormSubmit' : function($form) {
$(randomObject.config.container).load($form.attr('action')+' '+randomObject.config.container, $form.data('form_values'), function(response, status, xhr){
alert('updated!');
});
},
};
最佳答案
还不能发表评论，因为我没有权限。但使用委托(delegate)时，您需要将事件绑定(bind)在通过 AJAX 刷新的内容上方。因此，如果您仅重新加载页面的一部分，请不要在属于该页面的内容上设置委托(delegate)
<script>
$('#parent').delegate("a", "click", function(){
// AJAX CODE replaces the contents of #parent but not parent itself
});
</script>
<div id="parent">
<div id="ajax">
<a href="#">example</a>
<p>Some content</p>
</div>
</div>
我认为在上面的情况下这应该可以工作，因为委托(delegate)绑定(bind)在#parent 上并且#parent 没有被更新。显然这都是伪代码，但是您是否正在重新加载您委托(delegate)的项目？如果是这样，我认为您需要重新绑定(bind)事件。我非常确定“实时”事件已绑定(bind)到文档，然后它只是比较目标以确保它与选择器匹配。委托(delegate)从您指定的选择器开始，因此事件不需要冒泡那么远。 (据我了解)
关于ajax - jQuery 的 delegate() 不会为 AJAX 加载的内容绑定(bind)事件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/6573614/