初学者:Ajax教程无效

时间:2013-12-30 09:18:57

标签: javascript html ajax

我正在尝试使用youtube教程学习ajax。

但是,我在这里创建的所有内容都无法显示在视频中。我现在已经多次仔细检查了这段代码。

这是我的jsfiddle html代码。 js代码在小提琴中(链接如下)

<!DOCTYPE>
<body onload="process()">
Ok, you made it this far...
<br/>
<div id="theD"/>
</body>

这是jsfiddle:http://jsfiddle.net/patrickhaede/K7Tg7/

在本教程中,最终应该从txt文件中输出一个短文本。我已经在服务器上试过了,但它也没有用。关于州的信息也没有给出。

我真的很感激这里的一些帮助。

感谢。

3 个答案:

答案 0 :(得分:2)

我在下面更新您的代码 http://jsfiddle.net/K7Tg7/4/

  1. 在函数体

  2. 之后的SyntaxError:missing}
  3. 您应该使用document.getElementById()而不是getElementById()

  4. 如果您没有在本地计算机上构建主机,则ajax网址不正确

答案 1 :(得分:1)

说明网络开发?欢迎来到一个充满欢乐和痛苦的世界!

关于代码的一些事情:(其中一些已在评论中提及)

  • 始终在服务器(甚至是本地服务器)中测试JS。如果您只是打开html文件,浏览器会出于安全原因阻止ajax调用。

  • 使用带有JSLint的IDE来防止语法错误。

  • 在您的情况下,请务必检查浏览器控制台是否存在语法错误:缺少括号或未定义的函数。

希望这有帮助

答案 2 :(得分:1)

你的小提琴的另一个修改here

xmlHttp.open("GET", "/js/beautifier.js", true);

基本上,您通过Ajax请求的文件必须存在于服务器上。当您从JSfiddle请求“text.txt”时,找不到这样的文件,并且您获得404状态。

我没有使用像joyontbelong那样的/ echo / html /机制,而是选择了恰好出现在JSfiddle服务器上的文件。

echo / html是JSfiddle为模拟Ajax请求提供的有用工具,但它可能会让初学者感到困惑。

编辑:

首先,Ajax请求的“url”参数必须是服务器的本地参数。

如果您尝试引用外部URL(即使该URL恰好指向您自己的站点),XmlHTTPRequest对象将正确报告请求处理的各个阶段,但最终您将获得状态0和一个空的内容。

这是一个安全功能,可以防止每个人和他的狗用愚蠢的HTTP请求纠缠随机服务器。外部访问必须首先通过服务器,然后才允许JavaScript检索数据。

访问外部URL的方法是让服务器端脚本(用PHP或类似语言编写)访问外部数据,然后在此脚本上执行Ajax请求。

我认为在尝试之前你应该先熟悉一些概念。

与此同时,我建议您在计算机上安装Apache,这样您就可以通过http://localhost网址访问您网站的本地副本。

这样,您就可以完全控制您网站的内容,并能够创建您认为合适的文件。

我不会在这里写一篇Apache安装手册,所以我担心你的下一步是祈祷Google God能够启发你关于本地Apache服务器安装的奥秘:)

祝你好运