通过AJAX呈现表单时不适用于表单的jQuery代码

我的应用程序中使用jQuery的悬停事件具有相当标准的星型投票功能。一旦DOM被初始加载（HTML请求），星形投票逻辑就会用于页面的其余部分。但是，我想移动部分，以便它不会加载页面，但可以在用户需要时加载。我做了一个典型的AJAX请求来加载部分，但是当它被渲染时，星星不会像鼠标悬停一样对事件做出正确反应。这个问题是由于我通过AJAX呈现表单或者在我的代码中存在一个错误吗？感谢您的帮助通过AJAX呈现表单时不适用于表单的jQuery代码

更新：得到它使用on处理程序，感谢所有帮助！

来源

2012-05-19 Steve

向我们展示代码......否则说出现的情况就像是告诉机械师你的引擎出了什么问题，我发出声音。 –

你很可能试图将事件绑定到DOM中不存在的节点。解决此问题的最佳方法是绑定到Ajax请求之前存在的侦听器，该侦听器是被提取内容的祖先（有时不正确地称为“父级”，它只是祖先的一个级别）。例如，鉴于此标记在页面本身：

<div id="ajaxContainer"> 
    <!-- content will be periodically replaced with Ajax --> 
</div>

“ajaxContainer”是什么你要获取的祖先。然后，您需要使用适当的方法绑定侦听器。在过去，您可以使用live()，但不推荐使用，并且效率也不高。然后推荐给delegate()，解决了效率问题。现在它的代理侦听器语法为on()，与delegate()的性能大致相同，但语法不同。

就这么说吧，如果你使用jQuery 1.7+，可以使用.on()。

想象一下，您的Ajax函数将检索包含您的星系统mouseover的一部分页面，该页面位于一系列归类为“星星”的div中。语法可能看起来像：

$(document).ready(function() { 
    $('#ajaxContainer').on('mouseenter', '.stars', function() { 
    $this = $(this); // cache this specific instance of a stars div as a jQuery object 
    // do stuff with $this 
    }); 
});

这是说“开始内部ajaxContainer监听匹配的事件‘鼠标进入明星的div’，这时，做的东西。”

来源

2012-05-19 07:41:07

jQuery具有一个名为live的函数，它允许您将事件处理程序应用于尚未创建的对象。

如评论中所述，使用on（）代替。

来源

2012-05-19 07:28:51

_As of jQuery 1.7，.live（）方法已被弃用。使用[.on（）]（http://api.jquery.com/on/）附加事件处理程序。老版本的jQuery用户应该优先使用[.delegate（）]（http://api.jquery.com/delegate/）.live（）._ – Andreas

我不知道，谢谢你的信息！ –

-1

如果您在AJAX脚本中使用jQuery，请务必使用jQuery而不是$。

jQuery(selector [, context])

而不是

$(selector [, context])

来源

2012-05-19 07:31:11 dcd0181

了与阿贾克斯创建将不会对你的事件处理程序作出回应，作为事件处理程序仅在存在于DOM在initializiation的时间要素的工作内容。

您需要委托并侦听DOM中存在的元素上的事件，并捕获动态元素的冒泡。

你应该使用on()此：

$('#nonDynamicElement').on('mouseenter', '#dynamicElement', function() { 
    //do stuff 
});

来源

2012-05-19 07:35:50 adeneo

由于从jQuery的1.7+你应该为老版本的jQuery，你可以使用实时使用上（）（）

来源

2012-05-19 07:40:12

通过AJAX呈现表单时不适用于表单的jQuery代码

回答

相关问题