2011-08-19 46 views
1

我的公司有一个构建在ASP.NET中的Web应用程序,他们要求我为他们已有的仪表板页面编写一个小部件代码。这些小部件是在运行时动态加载的自定义用户控件。我的问题是我有一些自定义的JavaScript,需要运行每一个小部件加载。如何在jQuery中通过AJAX加载DOM运行DOM功能?

$(function() 
{ 
    // Setup widget. 
}); 

这在第一次加载仪表板页面时很有用。我的DOM就绪功能运行,一切都很好。但是,每当用户在仪表板上移动小部件时,所有小部件都位于更新面板中,并且它们都使用AJAX重新加载。 DOM准备好的功能在通过AJAX插入页面时不会运行。

有关如何确保每次加载小部件时都会运行此代码的任何建议?

回答

1

我解决这个问题的方法是,当您在加载时定义它们时,命名给定的事件出价。然后,在ajax的回调函数中取消设置这些事件,并将它们全部设置为新创建的dom元素。

+0

我的问题是我无法控制小部件的加载方式。不幸的是,我只能在小部件的范围内工作。如果我可以修改ajax电话,我肯定会。 – Chev

+0

啊,嗯。这很棘手。我不能说我以前曾尝试过这样做。 iframes不是一个选项吗?也许你可以让这些脚本在悬停而不是加载时运行?这会起作用吗?也许你可以让那些最初运行的函数动态地将脚本加载到页面头部,然后以某种方式监听Ajax重新洗牌事件?我不知道这是否使一切变得更容易或更难... – Hoatzin

+0

绝妙的主意。我会给它一个旋转。 – Chev

0

将HTML写入DOM后,每个窗口小部件都可以调用设置函数。

+0

这不正是我问怎么办?我试过在widget的底部包含一个不包含DOM的脚本。这会在页面加载时触发,但不会在通过ajax重新加载时触发。 – Chev

+0

DOM准备就绪 - 初始页面呈现时。当有回流或重绘时,它不会停止“准备好”。你可以做的只是查询DOM,看看你的元素在执行代码之前是否存在。 –

+0

谢谢你重新解释我已经解释过的问题。 – Chev

0

当你做你的Ajax调用有返回功能执行的设置代码

$.post(url, {/*data*/}, function() { 
    // return function call 
    // do setup code 
}); 

编辑:

因为你没有控制你可以有一个处理拦截AJAX调用:

$(#your-widget-area).ajaxComplete(function(e, xhr, settings) { 

}); 

你可以在这里找到文档:http://api.jquery.com/ajaxComplete/

+0

查看关于Hoatzin的回​​答的评论。听起来像没有这种控制,我可能会被拧紧。 – Chev