首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >部分视图中的$( document ).ready()仅在第一次通过AJAX添加到DOM时运行

部分视图中的$( document ).ready()仅在第一次通过AJAX添加到DOM时运行
EN

Stack Overflow用户
提问于 2014-06-16 13:24:46
回答 2查看 7.3K关注 0票数 3

在使用AJAX将分部视图加载到页面上的对话框之后,这段代码(位于分部视图本身而不在主页中)会运行,并且我会像预期的那样获得选项卡:

代码语言:javascript
运行
复制
// Run this on page load
$(function () {
    debugger;
    $("#ProjectTabset").tabs();
});

在这种情况下,如果包含部分的div从DOM中删除(使用jQuery remove),然后再次添加,并再次将部分加载到其中,它应该再次运行,但它没有运行。

为什么它会在第一次运行,而不是随后的任何一次?问题会不会是片断所插入的div并没有以某种方式真正删除?(尽管我正在测试它在创建之前并不存在,而且它似乎不再是DOM的一部分。)

如果我可以说得更清楚或提供更多细节,请告诉我:)

EN

Stack Overflow用户

发布于 2014-06-16 13:41:13

由于您已经从DOM中删除了元素并动态添加回来,如果您希望在动态添加的元素上处理事件,则可能需要通过on()使用委托事件。试试下面的方法,看看是否有帮助。

代码语言:javascript
运行
复制
$( document ).on( 'ready', function (e) {
   $("#ProjectTabset").tabs();
})

事件处理程序仅绑定到当前选定的元素;当您的代码调用.on()时,它们必须存在于页面上。若要确保元素存在并且可以选择,请在文档就绪处理程序内为页面上HTML标记中的元素执行事件绑定。如果要将新的HTML注入到页面中,请在将新的HTML放入页面后选择元素并附加事件处理程序。或者,使用委托事件附加事件处理程序,如下所述。委托事件的优点在于,它们可以处理稍后添加到文档中的后代元素中的事件。通过选取在附加委托事件处理程序时保证存在的元素,可以使用委托事件来避免频繁附加和移除事件处理程序。

可能是here将帮助您解决此问题的链接。

票数 0
EN
查看全部 2 条回答
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/24237056

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档