Javascript 函数应该在每次页面加载时运行

Question

我正在查看我正在维护（但没有编写）的 asp.net 2 Web 应用程序。

页面加载时应该发生的一些事情不会发生，但只是有时，如果您在 VM 中使用 Firefox 3，似乎会发生这种情况。使用 JQuery 和 asp.net Ajax。

应该每次都运行（但不运行）的重要功能由以下Javascript附加：

<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){ Sys.Application.add_load(ImportantFunction); });   
$(document).ready(function(){ Otherstuff(); });
$(document).ready(function(){ MoreStuff(); });
//]]>
</script>

但是，如果我使用 firebug 在 ImportantFunction() 中设置断点，它不会在 firefox 3 中的页面加载时命中，但会在 ajax 更新时命中。

在页面中有多个对 $(document).ready 的调用，因为它们来自其背后的 asp.net 代码的不同部分。是的，它们都执行。

Answer 1

有什么理由不能使用 ASP.NET AJAX pageLoad 函数代替 $(document).ready()？

function pageLoad(sender, args)
{
     ImportantFunction();
     OtherStuff();
     MoreStuff();
}

这是 ASP.NET AJAX 客户端页面生命周期的一部分，其中的所有 JavaScript 代码将在每次页面加载时执行，包括异步回发。

Answer 2

您正在使用 jQuery 附加一个“加载”方法，然后该方法又附加一个加载事件，我认为这就是您的问题所在。

$(document).ready 和Sys.Application.add_load 几乎相同，至少我的理解是这样。不过，我不确定浏览器会按什么顺序执行它们。

我建议删除 ImportantFunction 上的 Sys.Application.add_load 包装调用，这样您就不会尝试附加到已经触发的事件堆栈。

Answer 3

试试这个：

<script type="text/javascript">
//<![CDATA[
$(document).ready(ImportantFunction);   
$(document).ready(Otherstuff);
$(document).ready(MoreStuff);
//]]>
</script>

将对Sys.Application.add_load 的调用放入ImportantFunction 的正文中，即在您的.js 文件中：

function importantFunction()
{
   Sys.Application.add_load(ImportantFunction);
}

编辑：我不确定是否可以添加多个函数以在 $(document).ready 事件上运行。如果您这样做可能会有所帮助：

<script type="text/javascript">
    //<![CDATA[
    $(document).ready(init);   
    //]]>
    </script>

在init 中，您可以包含对所有其他函数的调用，即：

function init()
{
   importantFunction();
   otherStuff();
   moreStuff();
   //Any other functions to be called upon page load go here
}

这也将使代码更易于阅读:)

Answer 4

根据recent blog posting，这是 FireFox 3 中的一个错误（或至少是一个错误功能）。他建议将您的重要功能命名为 PageLoad 以使其跨浏览器工作，但我不确定是否行不行。