jQuery ajax加载方法卡在加载中[关闭]答案

【问题标题】：jQuery ajax load method stucked in loading [closed]jQuery ajax加载方法卡在加载中[关闭]
【发布时间】：2013-03-17 01:36:07
【问题描述】：

我搜索了整个网站，但找不到任何对我有帮助的东西，所以这里是：

我有这个 html 文件，当您单击 Get extern 时，它应该将 extern.html 中的内容放入名为 content 的 div 中，但是当您单击链接时，它会显示加载，仅此而已。

test.html 文件

<script type="text/javascript" src="jquery-1.9.1.js"></script>
<script type="text/javascript"><!--
$(document).ready(function() {
  // select all the links with class="lnk", when one of them is clicked, get its "href" value
  // adds a "loading..." notification, load the content from that URL and
  // place only the paragraph which is in the #cnt into the tag with id="content"
  $('a.lnk').click(function() {
    var url = $(this).attr('href');
    $('#content').html('<h4>Loading...</h4>').load(url+ ' #cnt p');
    return false;
  });
});
--></script>
</head>
<body>
<h1>Web page test.html</h1>
<a href="extern.html" title="Get extern" class="lnk">Get extern</a>
<div id="content">Initial content in test.html</div>

extern.html 文件

<h2>Content in extern.html</h2>
<div id="cnt"><p>Some text content in extern.html</p></div>

【问题讨论】：

标签： ajax jquery

【解决方案1】：

我的猜测是您尝试加载外部网页，但它被浏览器中的同源策略阻止。如果没有，有一个快速的方法来调试它。

1) 我最喜欢的是使用 Chrome 开发者面板（按 F12 打开）。转到网络选项卡并尝试通过您的 jQuery 加载外部页面。然后你可以观察网络活动，看看是否出现任何错误。

2) 用户 $.ajax 而不是 $.load。更多选项请参见此处：JQuery error option in $.ajax utility

如果问题确实是相同的域策略，请查看 jQuery 的 JSONP 功能。一个例子在这里：http://www.jquery4u.com/json/jsonp-examples/

希望这会有所帮助！

【讨论】：

由于 href 有一个相对 url，它不会是 SOP。
@Musa 确实如此。我第一次阅读时并没有注意到它......虽然它并没有真正影响这两个建议。谢谢！

【解决方案2】：

一般来说，这个'Loading'会在脚本没有成功执行或者出现一些逻辑/语法错误时出现。我假设您使用 firebug 验证了您的脚本，我建议您使用 $.noConfllict(); 检查以防您的页面是否有多个脚本块和库相互冲突。

【讨论】：