$(window).load(handler) 不会触发

Question

我一直在使用 jQuery 开发 Asp.NET Web 应用程序来生成甜美、灵活且快速的 UI。我已经创建了骨架

<div id='title'>
    &nbsp;&nbsp;
    <h3 class='color-black h3'>
        Choose the career</h3>
    <p>
        &nbsp;</p>
    <p>
        &nbsp;</p>
    <p>
        &nbsp;</p>
</div>
<div id='tabbedContent' class='tabbed_content'>
    <div id='tabs' class='tabs'>
        <div class='moving_bg'>
            &nbsp;
        </div>
    </div>
    <div id='contentID' class='slide_content'>
        <div id='tabsliderID' class='tabslider'>
        </div>
    </div>
</div>

，现在在开始时我将使用 jQuery 附加一些动态创建的 DOM 元素。我通过从 Page_Load 方法 (ASP) 调用两个 js 函数来实现这一点，这将实现所有的魔力。然后我需要初始化几个脚本（tabbedContent 和 iNettuts）。 问题是这些脚本仅在创建整个页面（包括动态创建的内容）后才需要初始化，所以我不能使用 $(document).ready ，当我使用 $(window).load 有时它可以工作，有时它可以工作没有。

我已经在谷歌上搜索了至少两个星期，但仍然一无所获。我应该怎么办？ jQuery 不应该处理这个问题吗？如果没有..有什么解决方法吗？

附：尝试让它在 IE7-8、Chrome 10 和 FF 6 中工作

，顺便说一句，一旦我实现了这一点，我将需要执行一些 Web 服务调用以从数据库获取数据。这会影响行为吗？我应该期待更多的头痛吗？

Answer 1

$(document).ready(handler) 是正确的形式。您也可以只执行 $(handler)

.load 方法是在元素上完成的，实际上用于将 XHR 调用的 HTML 响应加载到元素中。

Answer 2

您实际上不应该在 Page_Load 处理程序中从 .Net 调用 javascript 函数（当然这是可能的）。

相反，请将所有 jQuery 功能放入 $(document).ready() 中。然后，一旦页面加载并准备好通过 JavaScript 接受动态操作，它将被执行。这对于 IE6 兼容性尤其重要，因为如果您在页面完成加载之前尝试更改 DOM，则会出现阻塞。

因此，在您的情况下，您的 jQuery javascript 代码可能如下所示：

$(document).ready(function() {
    // create your dynamic content here
    tabbedContent();
    iNettuts();
});

Answer 3

Page_Load 非常适合您的 .ready 处理程序。如果您需要真正的动态 DOM 事件，您应该使用 .live()你的事件绑定。

protected void Page_Load(object sender, EventArgs e)
{
    // Define the name and type of the client scripts on the page.
    String csname1 = "PageStartUpScript";
    Type cstype = this.GetType();

    // Get a ClientScriptManager reference from the Page class.
    ClientScriptManager cs = Page.ClientScript;

    // Check to see if the startup script is already registered.
    if (!cs.IsStartupScriptRegistered(cstype, csname1))
    {
        StringBuilder cstext1 = new StringBuilder();
        cstext1.Append(@"$(document).ready(function() {
                                // add your startup.init functions here
                              });");

        cs.RegisterStartupScript(cstype, csname1, cstext1.ToString(), true);
    }
}

Answer 4

尝试使用 $(document).load 代替。

Answer 5

或者尝试 $(document).ready()

Answer 6

在 $(document).ready() 函数中，您可以创建一个哈希，其中包含需要加载为键的动态对象及其就绪状态作为值。每个动态对象完成加载后，将其值设置为 true。然后，您可以轮询以查看何时所有值都为 true，并在发生这种情况时执行您需要的代码。

$(window).load() 有时有效，有时无效，因为有时所有元素加载得足够快，以便在代码运行时做好准备。

Answer 7

在对您的建议进行了一些研究以及实施 Radus 建议的一个非常非常漫长的夜晚之后（这可以解释为要加载的每个元素的标志），我开始问自己：如果 ready() 有一个标志怎么办？在这种情况下，我不应该担心初始化的时间。好吧，事实证明这个标志确实存在，它的名字叫holdReady()。
基本上，它会阻止启动 read() 事件，直到该标志设置为 false。

“$.holdReady() 方法允许调用者延迟 jQuery 的就绪事件。此高级功能通常由动态脚本加载器使用，这些加载器希望在允许就绪事件发生之前加载其他 JavaScript（例如 jQuery 插件），即使 DOM必须在文档的早期调用此方法，例如在 jQuery 脚本标记之后立即调用此方法，在就绪事件已经触发后将不会产生任何效果。”[1]

所以，我这样做了：

$.holdReady(true); 
//using ASPs page_load so it will be triggered everytime 
//a postback happens -gonna need it for the AJAX requests i'm planning to do.
//Then I create the dynamic content
$.holdReady(false); //then I let the event fire


$(document).ready(function(){
  //append the dynamic content
  iNettuts.init();
  tabbedContent.init();
});

并且就是这样，问题解决了。希望这对其他人有帮助，谢谢大家。

[1] http://api.jquery.com/jQuery.holdReady/