Question

当我点击按钮时，我正试图用另一个HTML文件（content.html）中的内容动态更改div（＃div1）的内容（就像here那样），但是没有任何反应单击按钮。更不用说，文件并排放在一个文件夹中，所以我真的很难过。

这是我的代码：

的index.html ：

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $("#div1").load("content.html");
  });
});
</script>
</head>
<body>

<div id="div1"><h2>Let jQuery AJAX Change This Text</h2></div>
<button>Get External Content</button>

</body>
</html>

content.html ：

<!DOCTYPE html>
<html>
<body>
<h2>jQuery and AJAX is FUN!!!</h2>
<p id="p1">This is some text in a paragraph.</p>
</body>
</html>

Answer 1

使用服务器

主要是ajax问题归因于Same Origin Policy。有很多方法可以解决这个问题，我建议您使用本地网络服务器。设置本地网络服务器非常简单：

你可以使用LAMP，甲基苯丙胺， WAMP，或 XAMPP。这些都是免费且易于使用的。如果您不害怕使用命令行：

通过从本地目录运行python -m http.server来获取Python 3.x
PHP 5.4.0+运行 php -S localhost:<port_number>

仅选择正文...

大多数情况下，您不希望在代码中使用第二个doctype，因此请替换

$("#div1").load("content.html");

使用

$("#div1").load("content.html body");

jQuery - AJAX load（）方法不起作用

1 个答案: