1

谁能帮我理解为什么代码不起作用？

它不会将 div 中的文本更改为成员编写的文本。

提前为我的英语道歉，我的英语老师显然做得不好...... =/

第一页：

<script>
function showUser()
{
var str = document.forms["myForm"]["users"].value;
if (str=="")
  {
  document.getElementById("txtHint").innerHTML="";
  return;
  } 
if (window.XMLHttpRequest)
  xmlhttp=new XMLHttpRequest();
  }
else
  {
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","act2.php?q="+str,true);
xmlhttp.send();
}
</script>

<form name="myForm" onsubmit="return showUser()" method="post">
First name: <input type="text" name="users">
<input type="submit" value="Submit">
</form>

<div id="txtHint"><b>Person info will be listed here.</b></div>

第二页（act2.php）：（更正名称）

<?php
$q=$_GET["q"];

echo "$q";
?>
4

4 回答 4

1

此行中指定的文件

xmlhttp.open("GET","act2.php?q="+str,true);

是act2.php，但根据您的帖子，您正在寻找ajax2.php，是这样吗？

于 2013-01-15T10:34:47.390 回答
1

您只是忘记在 showUser 方法中“返回 false”，表单将在 Ajax 调用之前照常发布

编辑： 为了澄清，在 onsubmit 你有返回 showUser()，showUser 方法从不返回值，以阻止浏览器发布表单。此外，正如其他海报所建议的那样，您暗示 php 文件名为 ajax2.php，但代码实际上试图命中 act2.php。

此外，建议使用某种框架（jQuery 非常流行）。

于 2013-01-15T10:37:55.810 回答
0

你的函数需要返回 false 以防止表单的默认操作，否则你的表单将被提交（这是默认操作）。

只需return false在代码末尾添加 a 即可。

function showUser(){

   // ...
   xmlhttp.send();

   // prevents the default action (the submit from your form)
   return false;

}

或者：

<form name="myForm" onsubmit="showUser();return false;" method="post">

您也可以安全地删除 IE5/6 兼容代码。

if (window.XMLHttpRequest)
  xmlhttp=new XMLHttpRequest();
  }
else
  {
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }

简单地变成：

  var xmlhttp=new XMLHttpRequest();

前面var很重要，否则xmlhttp将成为全局对象的成员而不是作用域变量。

于 2013-01-15T11:00:57.800 回答
0

只是为了展示如何用更少的痛苦和 jQuery 来做同样的事情。

<form name="myForm" action="/act2.php">
    <input type="text" name="q">
    <input type="submit">
</form>

<div id="txtHint"></div>

<script type="text/javascript">
    $(document)
        // Link handler for submiting form
        .on('submit', 'form[name="myForm"]', function(e) {
            // Preventing original form submition
            e.preventDefault();

            // Send all data from form, to url from form's action attribute (/act2.php) and set received data to div with id txtHint
            $.get($(this).attr('action'), $(this).serialize(), function(data, status, xhr) {
                $('#txtHint').html(data);
            });
        });
</script>
于 2013-01-15T11:34:54.997 回答