Php JavaScript无法执行AJAX调用

我正在创建一个表单，可以使用PHP通过电子邮件发送数据，并使用JavaScript显示lightbox效果。因为我无法刷新页面，所以我决定使用AJAX将数据发送到PHP，但是我无法获得执行AJAX调用的代码。我在互联网上创建了这段代码，我可以按原样使用它，但当我将它实现到我的页面时，它就是不起作用

代码如下：

var time_variable;

function getXMLObject()  //XML OBJECT
{
   var xmlHttp = false;
   try {
     xmlHttp = new ActiveXObject("Msxml2.XMLHTTP")  // For Old Microsoft Browsers
}

catch (e) {
   try {
     xmlHttp = new ActiveXObject("Microsoft.XMLHTTP")  // For Microsoft IE 6.0+
   }
 catch (e2) {
   xmlHttp = false   // No Browser accepts the XMLHTTP Object then false
 }
}
  if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {
    xmlHttp = new XMLHttpRequest();        //For Mozilla, Opera Browsers
  }
   return xmlHttp;  // Mandatory Statement returning the ajax object created
}

var xmlhttp = new getXMLObject();   //xmlhttp holds the ajax object

function ajaxFunction() {
   var getdate = new Date();  //Used to prevent caching during ajax call
   if(xmlhttp) { 
   var txtname = document.getElementById("email");
       xmlhttp.open("POST","contactScript.php",true); //calling testing.php using POST method
       xmlhttp.onreadystatechange  = handleServerResponse;
       xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
       xmlhttp.send("email=" + txtname.value); //Posting txtname to PHP File
   }
}

function handleServerResponse() {
   if (xmlhttp.readyState == 4) {
      if(xmlhttp.status == 200) {
          document.getElementById("message").innerHTML=xmlhttp.responseText; 
      }
      else {
          alert("Error during AJAX call. Please try again");
      }
   }
}

每次我运行代码时，我都会意外地发现这个警报

也许值得一提的是，我从id=email的文本输入字段收集电子邮件数据，除了显示lightbox效果外，我不打算更新任何字段

任何帮助都将不胜感激

以下是PHP代码（contactScript.PHP）：

不确定这是否有帮助，但我怀疑我的提交按钮有问题：

    <form id="contactform" class="rounded" method="post" name="EmailForm">      

    <div class="field">
        <input type="text" id="email" class="input" name="email"    placeholder="your email address" />
        <a href = "javascript:submitForm()" onclick = "ajaxFunction();" class="button"> Submit </a>
        </div>

    </form>

---

AJAX调用要经过多个状态。无论当前状态是否为错误，if（）调用都会立即跳转到错误警报

例如：

---

只要readystate发生更改，您的处理程序就会被调用，并且由于第一次更改将达到阶段0，因此将调用您的错误警报。

以下是我将如何安排代码的布局：

var time_variable;

function getXMLObject() {
  var xmlHttp = false;
  if (typeof XMLHttpRequest != 'undefined') {
    // For Mozilla, Opera Browsers and newer IEs
    return new XMLHttpRequest();
  }
  try {
    // For Old Microsoft Browsers
    xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
  } catch (e) {
    try {
      // For Microsoft IE 6.0+
      xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
    } catch (e2) {
      // No ajax available
      xmlHttp = false;
    }
  }
  return xmlHttp;
}

function ajaxFunction() {
  // Declare variables
  var xmlHttp, postStr;
  // Get an AJAX object
  xmlHttp = getXMLObject();
  if (!xmlHttp) {
    alert("Sorry, your browser doesn't support AJAX");
    return;
  }
  // Initialise the request
  xmlHttp.open("POST", "contactScript.php", true);
  // Define the callback function
  xmlHttp.onreadystatechange = function () {
    if (xmlHttp.readyState < 4) {
      return;
    }
    if (xmlHttp.status == 200) {
      document.getElementById("message").innerHTML = xmlHttp.responseText; 
    } else {
      alert("Server responded with error code "+xmlHttp.status+"\n\nPlease try again");
    }
  };
  // Set the correct header for POST forms
  xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
  // Make the POST string
  postStr = "email="+encodeURIComponent(document.getElementById("email").value);
  // Send the request
  xmlHttp.send(postStr);
}

var时间变量；
函数getXMLObject（）{
var xmlHttp=false；
if（XMLHttpRequest的类型！=“未定义”）{
//适用于Mozilla、Opera浏览器和更新的IE
返回新的XMLHttpRequest（）；
}
试一试{
//对于旧的Microsoft浏览器
xmlHttp=新的ActiveXObject（“Msxml2.xmlHttp”）；
}捕获（e）{
试一试{
//适用于Microsoft IE 6.0+
xmlHttp=新的ActiveXObject（“Microsoft.xmlHttp”）；
}渔获物（e2）{
//没有可用的ajax
xmlHttp=false；
}
}
返回xmlHttp；
}
函数ajaxFunction（）{
//声明变量
var-xmlHttp，postStr；
//获取一个AJAX对象
xmlHttp=getXMLObject（）；
如果（！xmlHttp）{
警报（“对不起，您的浏览器不支持AJAX”）；
返回；
}
//初始化请求
open（“POST”，“contactScript.php”，true）；
//定义回调函数
xmlHttp.onreadystatechange=函数（）{
if（xmlHttp.readyState<4）{
返回；
}
if（xmlHttp.status==200）{
document.getElementById（“message”）.innerHTML=xmlHttp.responseText；
}否则{
警报（“服务器响应错误代码“+xmlHttp.status+”\n\n请重试”）；
}
};
//为POST表单设置正确的标题
setRequestHeader（'Content-Type'，'application/x-www-form-urlencoded'）；
//把帖子串起来
postStr=“email=”+encodeURIComponent（document.getElementById（“email”）.value）；
//发送请求
xmlHttp.send（postStr）；
}

---

我怀疑您仍然会遇到错误，但上面的代码将告诉您该错误的实际情况（HTTP状态代码），以便您可以调试PHP脚本。

实际发生了什么？您收到了什么错误？…您是否定义了

getXMLObject（）

？这种语法在我看来有点奇怪，为什么会有一个名为

getXMLObject

的对象？您肯定会有一个名为

getXMLObject（）

的函数，或者一个名为

XMLObject

的对象……我总是会看到警报对话框。尽管如此，将数据从输入字段发送到我的电子邮件的php脚本仍然有效。@user1052291然后您的

contactScript.php

文件返回的状态代码不是200。请发布该文件的内容。@DaveRandom我添加了PHP文件这实际上是不正确的，代码在

if

s的正确集合中，尽管它不是很明显，因为它的间隔很短。您如何调用

ajaxFunction（）

？什么是HTML？我通过一个链接来调用它，这个链接被设计成一个按钮，所以有点像

类型的东西？@gaban我想我看到了问题所在。您的

submitForm（）

函数在做什么？不管是什么，我怀疑它不应该这么做。尝试将

更改为

啊！我明白了，它现在起作用了。谢谢@DaveRandom。最初，我希望它的行为类似于表单输入按钮，在按下提交按钮后，文本字段将自动清空。我将看看是否可以在没有submitForm（）的情况下做到这一点

0. instantiated, not initialized
1. initialize/opened
2. send() called, no response
3. receiving data, text/body not available
4. all data received

var time_variable;

function getXMLObject() {
  var xmlHttp = false;
  if (typeof XMLHttpRequest != 'undefined') {
    // For Mozilla, Opera Browsers and newer IEs
    return new XMLHttpRequest();
  }
  try {
    // For Old Microsoft Browsers
    xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
  } catch (e) {
    try {
      // For Microsoft IE 6.0+
      xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
    } catch (e2) {
      // No ajax available
      xmlHttp = false;
    }
  }
  return xmlHttp;
}

function ajaxFunction() {
  // Declare variables
  var xmlHttp, postStr;
  // Get an AJAX object
  xmlHttp = getXMLObject();
  if (!xmlHttp) {
    alert("Sorry, your browser doesn't support AJAX");
    return;
  }
  // Initialise the request
  xmlHttp.open("POST", "contactScript.php", true);
  // Define the callback function
  xmlHttp.onreadystatechange = function () {
    if (xmlHttp.readyState < 4) {
      return;
    }
    if (xmlHttp.status == 200) {
      document.getElementById("message").innerHTML = xmlHttp.responseText; 
    } else {
      alert("Server responded with error code "+xmlHttp.status+"\n\nPlease try again");
    }
  };
  // Set the correct header for POST forms
  xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
  // Make the POST string
  postStr = "email="+encodeURIComponent(document.getElementById("email").value);
  // Send the request
  xmlHttp.send(postStr);
}