Question

我不确定我的所有文件都在同一个文件夹中有什么问题。首先，我将发布HTML，然后发布AJAX，最后发布.txt文件。

HTML：

<!doctype html>

<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>Title of webpage</title>
    <link rel="stylesheet" type="text/css" href="main.css">
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script type="text/javascript" src="javascript.js"></script>
</head>
<body>
    <div id="myDiv"><h2>Let AJAX change this text</h2></div>
    <button onclick="loadXMLDoc()">Change Content</button>

</body>
</html>

我的javascript / AJAX：

function loadXMLDoc(){
var xmlhttp = new XMLHttpRequest();

xmlhttp.onreadystatechange=function(){
    if (xmlhttp.readyState==4 && xmlhttp.status==200){
        document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
    }
}
xmlhttp.open("GET", "test.txt", true);
xmlhttp.send();
}

我的.txt文件：

<h3>This text was changed</h3>
<p>And also I added a random paragraph</p>

提前感谢你的帮助。

Answer 1

对于使用AJAX的第一步，你看起来很不错。但你真的需要一个网络服务器。要使您的示例正常工作，请执行以下操作：

在您的计算机上安装网络服务器。我建议您使用XAMPP作为第一步。从这里获取它：http://www.apachefriends.org/en/xampp.html你不应该自己配置一些东西，只需安装它，你最终应该得到一个“开箱即用”的网络服务器。
将所有文件放在htdocs文件夹中。在我的示例中，我将HTML文件命名为ajax.html。
确保您的网络服务器正在运行。打开浏览器并导航到localhost。你应该看到一个包含大量XAMPP的页面。
导航至localhost/ajax.html。我测试了你的代码，但它确实有效。

也许this W3CSchools AJAX tutorial可以为您提供有关AJAX的更多信息。

Answer 2

通过查看您发布的内容，我认为问题是您没有在Web服务器上运行它。在您的javascript上，您在客户端使用GET方法请求test.txt，但没有后端端使用text.txt文件来回答get请求。

您可以通过安装Apache等Web服务器并将文件放在www或httpdocs文件夹中来实现此目的。

我的简单AJAX示例有什么问题。你的网站必须在服务器上吗？

2 个答案: