真正基本的AJAX
我只是从AJAX开始。我正在尝试创建一个测试，在该测试中，我在文本输入框中输入一些文本，单击表单上的提交按钮，然后将该文本显示在我的页面上。我得到的直接错误是404错误( www.mysite.com/ajaxFunction() )，但我确信还有其他错误有待发现。有没有人能帮我改正这个错误，让我开始使用AJAX？我在转我的轮子想要开始。另外，请意识到我正在调用一个php脚本，因为这是我的最终目标所需要的，这也是为什么我不仅仅使用JavaScript本身的原因。谢谢!
下面是html：
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
</head>
<body>
<script language="javascript" type="text/javascript">
<!--
//Browser Support Code
window.onload = function ajaxFunction() {
document.myform.action = getFeedback();
}
function getFeedback() {
var xmlhttp;
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
} else {
// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
document.getElementById("feedback").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","scripts/handle_feedback.php",true);
xmlhttp.send();
}
//-->
</script>
<div id="leftsidebox"></div>
<div id="textboxdiv">
<form name="myform">
Text Here: <input type="text" name="textbox" id="name" />
<button type="submit">Submit</button>
</form>
</div>
<div id="feedback">
</div>
</body>
</html>handle_feedback.php
<?php
$mytext = $_REQUEST['textbox'];
return $mytext;
?>编辑:这是我最新的html代码。我对php进行了更改(将'return‘切换为'echo')
<script language="javascript" type="text/javascript">
<!--
//Browser Support Code
window.onload = function ajaxFunction() {
document.myform.onsubmit = getFeedback;
}
function getFeedback() {
var xmlhttp;
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
} else {
// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
document.getElementById("feedback").innerHTML=xmlhttp.responseText;
}
}
var textvalue = document.getElementById("name").value;
xmlhttp.open("GET","scripts/handle_feedback.php?textbox="+textbox,true);
xmlhttp.send();
}
//-->
</script>
<div id="textboxdiv">
<form name="myform">
Text Here: <input type="text" name="textbox" id="name" />
<button type="submit">Submit</button>
</form>
</div>
<div id="feedback">
</div>scripts/handle_feedback.php
<?php
$mytext = $_REQUEST['textbox'];
echo $mytext;
?>回答 3
Stack Overflow用户
发布于 2013-07-02 12:37:22
这不会做你所期望的事情：
document.myform.action = getFeedback();您可能希望它在提交表单时调用getFeedback。实际上并不是这样的。当浏览器尝试运行该代码时，它会意识到：“哦，嘿，我们正在分配action。但是等等，在右边，有一个函数调用！我必须评估该函数调用，以便找到要将action设置为的返回值！“所以你的浏览器会尽职尽责地立即调用getFeedback。由于getFeedback不返回任何内容，因此它将action设置为undefined。天哪，这可真有帮助。
如果我们希望在提交表单时调用JavaScript函数，那么设置action不是正确的方法。那么什么才是正确的方式呢？事件侦听器。附加事件侦听器的最常见方法是使用addEventListener，但由于您的用例相当简单，我们将使用一种更简单但经常被忽略的方法:设置onsubmit
document.myform.onsubmit = getFeedback;请注意，我们不会在getFeedback后面加上括号。这是故意的。我们希望将onsubmit设置为getFeedback函数本身，而不是它的返回值。
您还在没有定义textbox的情况下使用它。当然，它存在于文档中，但这并不意味着它在脚本中是可用的变量。要访问它，您需要首先获取元素，然后获取该元素的值：
document.getElementById('name').value另一件可能会给你带来好处的事情是同源策略。不需要使用完整的URL来访问open，只需传递一个相对URL：
xmlhttp.open("GET", "something.php" /* ... */, true);Stack Overflow用户
发布于 2013-07-02 12:23:20
它应该是echo而不是return。函数中使用return来返回数据。
<?php
$mytext = $_REQUEST['textbox'];
echo $mytext;
?>您还必须将参数发送到php文件
xmlhttp.open("GET","scripts/handle_feedback.php?textbox=your_value",true);Stack Overflow用户
发布于 2013-07-02 12:38:01
第一点:客户端的请求参数丢失。
发送GET请求的querystring中的参数。
var textvalue = document.getElementById("name").value;
xmlhttp.open("GET","scripts/handle_feedback.php?textbox="+textvalue ,true);有关更多参考read here，请参阅。
第二点是：
'return‘语句与函数/方法一起使用。因为这里没有任何函数，所以不使用'echo‘或'print’语句。
<?php
$mytext = $_REQUEST['textbox'];
echo $mytext;
?>https://stackoverflow.com/questions/17417339
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号