使用AJAX STILL提交表单不起作用

时间:2013-06-10 18:39:51

标签: ajax html-form

我花了5个小时试图避免发布这个,但我无法找到这个代码的错误。我希望在不离开HTML页面的情况下向电子邮件发送评论,但只需在表单底部添加PHP echo。这是我的HTML:

<form name="form1" method="post" enctype="multipart/form-data" action="javascript:submitForm();">
<table>
<tr>
<td valign="top">
<label for="first_name">First Name *</label>
</td>
<td valign="top">
<input  type="text" name="first_name" maxlength="50" size="30">
</td>
</tr>
<tr>
<td valign="top">
<label for="last_name">Last Name *</label>
</td>
<tr>
<td valign="top">
<label for="email">Email Address *</label>
</td>
<td valign="top">
<input  type="text" name="email" maxlength="80" size="30">
</td>
</tr>
<tr>
<td valign="top">
<input  type="text" name="telephone" maxlength="30" size="30">
</td>
</tr>
<tr>
<td valign="top">
<label for="comments">Comments *</label>
</td>
<td valign="top">
<textarea  name="comments" maxlength="1000" cols="25" rows="6"></textarea>
</td>
</tr>
<tr>
<td colspan="2" style="text-align:center">
<input type="submit" value="Submit"> 
</td>
</tr>
</table>
</form>

<div id="text"> </div>

我的AJAX:

function submitForm(str)
{
if (str=="")
  {
  document.getElementById("text").innerHTML="";
  return;
  }
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("text").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","contact.php?q="+str,true);

xmlhttp.send();
}

我可以确认我的php工作正常,因为当我将表单操作更改为&#34; contact.php&#34;它完美地运作。问题是,当我尝试使用AJAX获取php时,firefox开发人员工具确认contact.php被称为正常函数:submitForm()但它只是不起作用。有人可以帮忙吗?

1 个答案:

答案 0 :(得分:0)

一个问题是:“contact.php?q =”+ str

根据上面的标记,str将始终未定义,因此您永远不会将表单数据发送到contact.php。另外,当您设置action =“contact.php”进行测试时,您正在使用POST,并且您的ajax调用是GET。所以你可能仍然遇到PHP脚本的问题。