getJSON在Safari中工作但不在Chrome或Firefox中构建HTML

问题描述：

您好我实际上是一个使用javascript和html/css的新手。getJSON在Safari中工作但不在Chrome或Firefox中构建HTML

我不明白为什么我的脚本在safari上工作，但没有在chrome和firefox上... 有什么想法吗？

编辑：在铬和安娜Firefox中的ul和li元素不显示...此外，以前的警报不起作用。我会检查控制台中的错误并再次编辑帖子

<!DOCTYPE html> 
<html> 
    <head> 
     <script src="http://code.jquery.com/jquery-latest.js"></script> 
    </head> 
    <body> 
     <div id="patients" style="text-align:center"> 

     </div> 
     <script type="text/javascript"> 
      $.getJSON("http://www.url.com/json", 
         function(data) { 

         var items = []; 
         alert(data[1].patient); 
         alert(data[1].hr); 

         $.each(data, function(index, val) { 
          items.push('<li id="' + index + '">' + val.patient + '<div style="display: none" id="'+val.patient+'"></div></li>'); 
          }); 

         $('<ul/>', { 
         'class': 'my-new-list', 
         html: items.join('') 
         }).appendTo('#patients'); 


         }); 
      </script> 

    </body> 
</html>

定义'不工作'。你有什么尝试？你得到什么错误？什么警报都没有显示？ – 2012-07-30 11:06:35

我也没有。你能更新你的帖子，并详细说明“问题”吗？什么不起作用（你期望什么，什么不发生）。此外，选择一个更具描述性的标题。 – 2012-07-30 11:07:00

@RobW：你有足够的声望来帮助这个新手。通过这个问题的内容，您可以轻松编辑问题标题。为新用户提供帮助比预先投票更积极主动，抱怨...提供帮助和指导。 – 2012-07-30 11:14:11

答

你必须明白的第一件事情是当javascript在页面上执行时。

因此，在您发布的代码中，浏览器首先加载jQuery库。当它遇到你的<script>标签时，它会尝试执行$.getJSON()函数。

在您的脚本中，在成功完成json请求后，它试图通过将生成的html添加到#patients来修改DOM。由于您无法保证浏览器已呈现＃个患者，因此这种方式无法百分之百地工作。

您应该首先将您的JavaScript代码封装在仅在页面加载后执行的包装器中。

这可以通过几种方式完成。这些是jQuery特定的方法，因为这就是你正在使用的。

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

或者：

$(function(){ 
    //your code 
});

本地JavaScript代码看起来是这样的：

document.addEventListener('load', function(){ 
    //your code 
}, false);

我会建议使用的jQuery的方法之一。

作为附加提示，您不需要将type="text/javascript"放在脚本标记中。所有的浏览器都明白脚本标签意味着javascript。幸运的是，我们已经过去了各种破碎版本Internet Explorer的旧时代。

@ user848778：我反对非类型用法。我建议你**总是**使用MIME类型的脚本标签内容，因为它可以说是更传统的*。但我确实赞同Geuis所说的一切（+1）。使用第二个在DOM准备好而不是立即运行脚本的脚本。 – 2012-07-30 11:21:50

试过你的解决方案。不幸的是它不起作用。我在Os X山狮上使用了Chrome和Firefox。Safari运行良好 – matteosilv 2012-07-30 11:54:32

这不是一个真正的建议，而是一个强制性的第一步。您*有*要延迟脚本执行，直到DOM准备好之后。之后，如果您发布更多数据，我们可以开始排除您的问题。 – Geuis 2012-07-30 18:16:04

getJSON在Safari中工作但不在Chrome或Firefox中构建HTML

相关推荐