jQuery 追加在 getJSON 回调之外不起作用答案

【问题标题】：jQuery's append not working outside of getJSON callbackjQuery 追加在 getJSON 回调之外不起作用
【发布时间】：2012-11-19 14:54:19
【问题描述】：

我正在整合我所有的 JSON 调用。我从这个$.getJSON 调用中取出了所有内容，并验证我的页面仍然有效，但是当我取出附加和列表视图时，内容永远不会出现。

这行得通：

    $.getJSON("data/rides.json",
        function(data){
          $('#myRideList').append( rideList.join(' ') );
          $('#myRideList').listview('refresh');
      });

但这不是：

  //  $.getJSON("data/rides.json",
  //    function(data){
          $('#myRideList').append( rideList.join(' ') );
          $('#myRideList').listview('refresh');
 //     });

【问题讨论】：

标签： javascript jquery function append

【解决方案1】：

您可能在 DOM 准备好之前运行代码。

getJSON 版本将异步运行，让 DOM 有机会加载。

第二个版本将立即运行。

您可以将代码放在.ready() 处理程序中，以确保 DOM 已准备就绪。

$(function() {
  //  $.getJSON("data/rides.json",
  //    function(data){
          $('#myRideList').append( rideList.join(' ') );
          $('#myRideList').listview('refresh');
 //     });
});

我上面使用的语法是一个快捷方式：

$(document).ready(function() {
    // ...
});

最简单的解决方案往往是最好的。正如@T.J.Crowder 所指出的那样，将脚本放在页面底部（或至少在页面上所需元素之后的某个位置） 的经过验证的真实技术很简单，不需要在-引擎盖技巧。

<body>
   <!-- your HTML markup -->

   <script type="text/javascript" src="http://example.com/my/script.js"></script>
</body>

【讨论】：

更好，put the script at the bottom of the document。 ready 对于库等很有用，但对于您自己的页面/应用程序，您最好将脚本元素放在底部。页面源代码中的脚本元素has access to all of the elements defined above it。
我同意@T.J.Crowder。将脚本放在页面底部是绝对简单和零开销的最佳选择。
显然这回答了你的问题，请选择它作为答案。
@user1868945：（因为您是新来的。） 如果这回答了您的问题，请单击它旁边的复选标记以将其标记为“已接受”答案。更多：meta.stackexchange.com/questions/5234/…