0

我正在构建一个在线计算器并尝试通过 AJAX 发送值以通过 php 脚本处理它们。来自服务器的响应设置为 div，但该 div 显示后立即消失。我的ajax代码是：

function get_XmlHttp() {
  // create the variable that will contain the instance of the XMLHttpRequest object         (initially with null value)
  var xmlHttp = null;

  if(window.XMLHttpRequest) {       // for Forefox, IE7+, Opera, Safari, ...
    xmlHttp = new XMLHttpRequest();
  }
  else if(window.ActiveXObject) {   // for Internet Explorer 5 or 6
    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
  }

  return xmlHttp;
}
function ajaxrequest(php_file, tagID) {
  var request =  get_XmlHttp();     // calls the function for the XMLHttpRequest instance

  // gets data from form fields, using their ID
  var c1 = document.getElementById('c1').value;
  var c2 = document.getElementById('c2').value;
  var c3 = document.getElementById('c3').value;
  var c4 = document.getElementById('c4').value;
  var c5 = document.getElementById('c5').value;
  var c6 = document.getElementById('c6').value;


  // create pairs index=value with data that must be sent to server
  var  the_data = 'c1='+c1+'&c2='+c2+'&c3='+c3+'&c4='+c4+'&c5='+c5+'&c6='+c6;

  request.open("POST", php_file, true);         // sets the request

  // adds a header to tell the PHP script to recognize the data as is sent via POST
  request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  request.send(the_data);       // sends the request

  // Check request status
  // If the response is received completely, will be transferred to the HTML tag with tagID
  request.onreadystatechange = function() {
    if (request.readyState == 4) {
      document.getElementById("ajaxform").submit();
      document.getElementById(tagID).innerHTML = request.responseText;


    }
  }
}

请注意，我对实际站点使用引导 CSS 框架，而不是在响应 div 上应用任何类。

谢谢

4

1 回答 1

2

在您的onreadystatechange处理程序中，您正在提交一个表单，这导致页面提交（因此页面发生更改）。

request.onreadystatechange = function () {
    if (request.readyState == 4) {
        document.getElementById("ajaxform").submit(); // <-- ?
        document.getElementById(tagID).innerHTML = request.responseText;
    }
}

您再次看到同一页面的事实意味着该表单ajaxform没有action设置。

于 2013-04-30T20:32:09.933 回答