gpt4 book ai didi

javascript - 带有 javascript 的 Ajax 无法在 wamp 服务器上运行

转载 作者:行者123 更新时间:2023-12-04 10:49:26 24 4
gpt4 key购买 nike

我是 ajax 的新手,正在按照 youtube 教程创建一个简单的食物搜索应用程序
用户在输入字段中输入食物名称的地方,它显示下面的名称,否则它
说食物不可用
但不知何故它在 wamp 服务器上不起作用..它显示错误警报

这是我的代码

索引.html

<!Doctype html>
<html lang = "en">
<head>
<title>Ajax app</title>
<meta charset = "UTF-8">
<style>

</style>
<script type="text/javascript" src="foodstore.js"></script>
</head>
<body onload="process()">

<h3>The Chuff Bucket</h3>
Enter the food you would like to order:
<input type="text" id="userInput"/>
<div id="underInput"></div>
</body>
</html>

食品店.js
var xmlHttp = createXmlHttprequestObject();

function createXmlHttprequestObject()
{
var xmlHttp;
if(window.ActiveXObject){

try{
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}catch(e){

xmlHttp =false;
}
}else{

try{
xmlHttp = new XMLHttpRequest();
}catch(e){

xmlHttp =false;
}

}

if(!xmlHttp){
alert("can't create that object boss");
}else{
return xmlHttp;
}
}

function process()
{
if(xmlHttp.readyState==0||xmlHttp.readyState==4){
food = encodeURIComponent(document.getElementById("userInput").value);
xmlHttp.open("GET","foodstore.php?food=" + food, true);
xmlHttp.onreadystatechange = handleServerResponse;
xmlHttp.send(null);
}else{
setTimeout("process()",1000);
}
}
function handleServerResponse()
{
//readystate 4 whenever response is ready and object done communicating
if(xmlHttp.readyState==4){
//state 200 means communiaction went ok
if(xmlHttp.readyState==200){
xmlResponse = xmlHttp.responseXML;
xmlDocumentElement = xmlResponse.documentElement;
message = xmlDocumentElement.firstChild.data;
document.getElementById("underInput").innerHTML = "<span style='color:blue'>" + message + "</span>"
setTimeout("process()",1000);
}else{
alert("something went wrong");
}
}
}

食品店.php
<?php
header("Content-type: text/xml");
echo "<?xml version='1.0' encoding='UTF-8' standalone='yes'?>";

echo "<response>";
$food = $_GET["food"];
$foodArray = array("tuna","bacon","beef","loaf","ham");
if(in_array($food,$foodArray))
{
echo "We do have" .$food. "!";
}
elseif($food ="")
{
echo "Enter a food please.";
}
else
{
echo"sorry but we don't even sell" . $food. "!";
}
echo "</response>";
?>

任何帮助将不胜感激,谢谢

最佳答案

请不要使用 xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); .您最好的选择是结合 jQuery ,但是 "ActiveXObject("Microsoft.XMLHTTP")"已过时(即使对于 Microsoft 环境),并且在许多浏览器上不受支持。

这是一个 simple example (没有jQuery):

var xmlhttp = new XMLHttpRequest();
var url = "myTutorials.txt";

xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var myArr = JSON.parse(this.responseText);
console.log('myArr', myArr);
}
};
xmlhttp.open("GET", url, true);

所有现代浏览器都支持此语法……并且自 IE7(自 2006 年以来)以来一直受 Microsoft 支持。

还:

如果您还不熟悉 Chrome 开发者工具(Chrome 浏览器的一部分),您肯定想了解它:

https://developers.google.com/web/tools/chrome-devtools

关于javascript - 带有 javascript 的 Ajax 无法在 wamp 服务器上运行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59549593/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com