且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

在ajax中调用PHP函数,不赞成使用同步XMLHttpRequest

更新时间:2023-02-19 13:10:52

您应在 async 参数中使用 true .

类似这样的内容: xmlhttp.open("GET","update.php?status = disp",true); .

请参见您可以使用此帮助函数来生成 XMLHttpRequest .

You could use this helper function to make XMLHttpRequest.

可在所有浏览器中使用,包括IE6.

var newXHR = null;

function sendXHR(type, url, data, callback) {
  newXHR = new XMLHttpRequest() || new window.ActiveXObject("Microsoft.XMLHTTP");
  newXHR.open(type, url, true); // Use async = true to avoid bad user experience for waiting a Sychronous request that might block the UI.
  newXHR.send(data);
  newXHR.onreadystatechange = function() {
    if (this.status === 200 && this.readyState === 4) {
      callback(this.response); // Callback function to process the response.
    }
  };
}

用法:

sendXHR("GET", "update.php?status=disp", null, function(response) {
  console.log(response);
});

您可以使用此演示检索数据:

You could retrieve data by using this demo:

(function() {



  var newXHR = null;

  function sendXHR(type, url, data, callback) {
    newXHR = new XMLHttpRequest() || new window.ActiveXObject("Microsoft.XMLHTTP");
    newXHR.open(type, url, true); // Use async = true to avoid bad user experience for waiting a Sychronous request that might block the UI.
    newXHR.send(data);
    newXHR.onreadystatechange = function() {
      if (this.status === 200 && this.readyState === 4) {
        callback(this.response); // Callback function to process the response.
      }
    };
  }


  // Example 1: Get data.
  var btnRequest = document.getElementById("btnRequest");
  btnRequest.onclick = function() {
    sendXHR("GET", "https://gist.githubusercontent.com/dannyjhonston/22851f9c21733973b2705b0b65443f90/raw/30cf99ceeb470a7ab6d2ffb51a78f1bb57f41ca3/data.txt", null, function(response) {
      document.getElementById("myDiv").innerHTML = response; // response contains the data from the server.
    });
  };


  // Example 2. Cancel a long request.
  var btnCancelRequest = document.getElementById("btnCancelRequest");
  btnCancelRequest.onclick = function() {
    newXHR.abort(); // You can use the newXHR variable to abort a XMLHttpRequest that is taking long time to response, with the .abort() method.
  };





})();

#myDiv {
  border: solid 1px #ccc;
  border-radius: 5px;
  margin: 20px;
  padding: 5px;
}

<button id="btnRequest" type="button">Request data</button>
<button id="btnCancelRequest" type="button">Cancel request</button>
<div id="myDiv">The new content will print here.</div>

很高兴知道这一点:

XMLHttpRequest.response 属性返回响应的身体.它可以是 ArrayBuffer Blob Document JavaScript 对象或 DOMString ,具体取决于 XMLHttpRequest.responseType 属性.如果,则响应值为null请求未完成或未成功.但是,如果 responseType 的值设置为"text" 或空字符串,响应可以包含部分文本响应,而请求是仍处于加载状态.

XMLHttpRequest.response property returns the response's body. It can be of the type ArrayBuffer, Blob, Document, JavaScript object, or a DOMString, depending of the value of XMLHttpRequest.responseType property. Value of response is null if the request is not complete or was not successful. However, if the value of responseType was set to "text" or the empty string, response can contain the partial text response while the request is still in the loading state.

XMLHttpRequest.responseText 属性返回 DOMString 包含对请求的响应的文本形式;如果为 null ,则为 null 请求失败或尚未发送. responseText 属性会在到达之前就具有部分响应请求已完成.如果 responseType 设置为除空的 string "text" ,访问 responseText 会抛出 InvalidStateError 异常.

XMLHttpRequest.responseText property returns a DOMString that contains the response to the request as text, or null if the request was unsuccessful or has not yet been sent. The responseText property will have the partial response as it arrives even before the request is complete. If responseType is set to anything other than the empty string or "text", accessing responseText will throw InvalidStateError exception.


您的的问题的代码必须是这样的:


Your php code must be like this:

$status = $_GET["status"];
if($status=="disp")
{
    $link = mysqli_connect("localhost", "root", "");
    mysqli_select_db($link,"checkbox");
    $res = mysqli_query($link,"SELECT * FROM table1");

    $html = "<table>"; // Declare a variable to concat the html content.
    while($row = mysqli_fetch_array($res))
    {
        $html += "<tr><td>";
        $html += $row["id"];
        $html += "</td><td>";
        $html += $row["name"];
        $html += "</td><td>";
        $html += $row["city"];
        $html += "</td></tr>";
    }
    $html += "</table>";
    echo $html; // Prints the $html variable.
}

在您代码的问题中,您需要删除:

In you html code you need to remove:

<script src="jquery-3.2.1.min.js"></script>

如果您要使用本机.