Question

我刚开始使用jQuery，并且无法做一些令人尴尬的简单操作：使用.load（）将外部HTML插入主页。

这是主页：

<html>
    <head>
    <script src="js/jquery-latest.min.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript" charset="utf-8">
        $(document).ready(function(){
            $(".log").ajaxError(function() {
                $(this).text('Ajax error.');
            });

            $('.result').load('external.html', function() {
                $('.log').text('Loaded.')
            });
        });
    </script>
    </head>
    <body>
        <div class="log">
        </div>
        <div class="result">
        </div>
    </body>
</html>

这是external.html：

<p>Some external content!</p>

当我在浏览器中打开此页面时，“已加载”。插入到.log div中，但外部HTML未插入.result div。此外，即使我删除external.html或重命名该文件，它仍然会显示“已加载”。如果找不到该文件，那不应该是Ajax错误吗？似乎没有.load（）正在抓取数据。

编辑：根据chrissr的建议，我更改了代码：

$(".result").load("external.html", function(response, status, xhr) {
  if (status == "error") {
    var msg = "Sorry but there was an error: ";
    $(".log").html(msg + xhr.status + " " + xhr.statusText);
  } else {
    var msg = "Everything worked fine!";
    $(".log").html(msg);
}
});

当我运行它时，它会插入“一切正常！”进入.log div。

编辑2：刚刚在Firefox中尝试过，它可以正常工作！（之前我使用的是Chrome）。我认为jQuery适用于Chrome，对吧？

编辑3：问题解决了！我在本地打开文件（如file：//）。我认为这会导致安全问题。无论如何，现在我知道如果我想用chrome测试，我必须首先把它扔到我的网络服务器上。

Answer 1

无论成功与否，都将执行.load（）回调。它只是表明加载操作已经完成（成功与否）。

尝试这样的方法来获取详细信息：

$(".result").load("external.html", function(response, status, xhr) {
  if (status == "error") {
    var msg = "Sorry but there was an error: ";
    $(".log").html(msg + xhr.status + " " + xhr.statusText);
  }
});

我猜你在使用same origin policy时遇到了问题，或者我认为external.html的路径不正确。

Answer 2

您确定external.html与此页面位于同一目录中吗？

Answer 3

我复制了你的HTML文件并引用了我的本地jQuery-1.4.1.min.js文件，它运行正常。就像Adam说的那样，你应该查看脚本源路径和external.html路径是否正确。

Answer 4

问题解决了！我在本地打开文件（如file：//）。我认为这会导致安全问题。无论如何，现在我知道如果我想用chrome测试，我必须首先把它扔到我的网络服务器上。

jQuery load（）方法的问题

4 个答案: