当页面完全加载时，Div清除

Question

我正在使用JavaScript＆amp; Ajax进行php调用以从我的数据库返回数据。该调用将按原样返回数据，但是当页面完全加载时，echo标记值将被清除。

我需要更改语法，以便div标签保留php文件中的值<form id="form1" method="post"> <div id="results">&nbsp;</div> <div style="padding-top: 10px;"><input type="submit" value="Submit" onclick="MakeQuery()" /></div> <script type="text/javascript"> var xhttp; function MakeQuery() { if (window.XMLHttpRequest) { xhttp = new XMLHttpRequest(); } else if (window.ActiveXObject) { xhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xhttp.onreadystatechange = function(){ if (xhttp.readyState == 4 && xhttp.status==200) { document.getElementById("results").innerHTML = xhttp.responseText; } } xhttp.open("GET", "SQLQuery.php", true); xhttp.send(); } </script> </form> ？我检查了控制台，它只显示页面加载信息，没有任何与此问题相关的信息（至少不是我看到的）。

ACTION_IMAGE_CAPTURE

Answer 1

我认为您需要在使用AJAX之前阻止实际表单提交：

var xhttp;

function MakeQuery(event) {
  event.preventDefault(); // Cancel form submit, use AJAX

  if (window.XMLHttpRequest) {

    xhttp = new XMLHttpRequest();
  } else if (window.ActiveXObject) {
    xhttp = new ActiveXObject("Microsoft.XMLHTTP");
  }
  xhttp.onreadystatechange = function() {
    if (xhttp.readyState == 4 && xhttp.status == 200) {
      document.getElementById("results").innerHTML = xhttp.responseText;
    }
  }
  xhttp.open("GET", "SQLQuery.php", true);
  xhttp.send();
}