在 Jquery 中生成 HTML 之前执行的脚本？答案

【问题标题】：Script executed before HTML generated in Jquery?在 Jquery 中生成 HTML 之前执行的脚本？
【发布时间】：2011-08-31 23:23:29
【问题描述】：

我对jQuery的理解是文档一准备好就会执行脚本。

我有一些动态生成的 HTML，一旦从服务器返回关于生成什么的响应，就会在页面加载时生成这些 HTML。 HTML 都是模板的一部分。所有这些都以以下行开始。

   window.App=new AppView;

在那一行之后，我有

   alert($("#field").val());

其中 $("#field") 是模板的一部分，它是动态生成到 HTML 中的

并且 NULL 被警告。

但如果我设置一个 setTimeout 来执行警报，我会看到一个值。这两行代码都在 jQuery {} 中。

有人可以解释为什么在执行第一行中的所有内容之前执行第二行。

附：这是生成模板的那一行

     $("body").html($.tmpl("temp", data));

【问题讨论】：

不知道AppView-function的内容是无法回答的。因为它可能包含例如包含超时的内容。
那里没有超时或与延迟有关的任何事情。这是一个很长的代码，如有必要，我将尝试提取任何相关性
@Alxandr，还有什么可能的原因，所以我会知道要寻找什么。里面的所有代码基本上都涉及，向服务器发送 GET 请求并将响应解析为字段

标签： javascript jquery templates

【解决方案1】：

我想我刚刚发现了问题所在。您说您的代码涉及从服务器获取 GET 请求？嗯，这意味着异步代码。换句话说，这就是发生的事情：

You call new AppView
    - Inside AppView, a XHR is created, sending a GET request to server
    - Code finishes inside AppView, and returns to calling function
You call alert field val (not created yeat)
Some time later, the GET request is finnished
    - Inside callback-function for GET-request. Your field get's created.

【讨论】：

是的。这也是我的猜测。这通常是如何解决的？在浏览器控制台中确实有一个 XHR
一般有两种方式，一种不好（同步运行请求），一种很好。一个好的是将您的代码作为回调运行。但是，如果没有更多代码，我无法解释。
我想我明白了。谢谢！

【解决方案2】：

你应该只在 DOM 准备好时使用 jQuery：

window.App=new AppView;

$(document).ready(function() { // Triggered when the whole DOM is ready
  alert($("#field").val());
});

【讨论】：

他是不是说“两行代码都在 jQuery {} 内”？你不认为这意味着它在像这样的 jQuery 函数中：jQuery(function() {/*code here*/}，换句话说，在页面加载时运行？
我确实说过一切都在 jQuery {} 中。而且我还尝试使用单独的 $(document).ready ...，但不走运。这一次它甚至在浏览器有机会显示来自服务器的响应之前就发出警报

【解决方案3】：

您需要将代码封装在页面加载完成时调用的事件处理程序中！

$(function() {
   $('body').html($.tmpl("temp", data));
});

【讨论】：