Question

我正在尝试运行我在以下链接中找到的答案： Asynchronously Load the Contents of a Div

但是当我这样做时，我会得到一些我不太了解的错误。

我的代码：

$(document).ready(function() {
  $("#first").load(function() {
    $("body").append($("<div></div>").attr({
      id: "second"
    }).text("Second"));
    $("#second").load(function() {
      $("body").append($("<div></div>").attr({
        id: "third"
      }).text("Third"));
    });
  });
});

<html>

<head>
  <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-
3.2.1.min.js"></script>
</head>

<body>
  <div id="#first">First</div>
</body>

</html>

我从Chrome回来的错误很多。但这里是亮点：

Uncaught TypeError: a.indexOf is not a function
    at r.fn.init.r.fn.load (jquery-3.2.1.min.js:4)
    at HTMLDocument.<anonymous> (temp.html:6)
    at j (jquery-3.2.1.min.js:2)
    at k (jquery-3.2.1.min.js:2)

有什么想法吗？

Answer 1

此错误可能是由.error，.load或.unload等jquery事件别名引起的。自jQuery 1.8以来已弃用这些内容。您需要将它们替换为.on()来注册侦听器。例如：

$(window).load(function(){
  ...
});

变为：

$(window).on('load', function(){
 ...
});

请尝试使用.on()

Answer 2

使用以下方法解决了您的第一个问题：

$("#first").on('load', function() {
  *code to be executed*
}

自jQuery 1.8

以来，

.load已被弃用

你提到的第二个问题是只创建了第一个div，因为你在第二个div加载时试图执行下一个函数来创建第三个div但是实际上第二个div没有被加载，因为你要附加它所以在这种情况下没有负载。

你可以一个接一个追加，它们会按照你想要的那样出现。

jQuery .load（）失败

2 个答案: