使用AJAX只获取PHP响应 - Fetch Only PHP Response using AJAX

Fetch Only PHP Response using AJAX

本文关键字：PHP 响应获取 AJAX 使用 | 更新日期: 2023-11-09

我正在尝试使用AJAX传输数据。我有两个文件，一个有PHP、HTML，另一个有JS代码：

test.php：

<?php
  if($_SERVER["REQUEST_METHOD"] == "POST"){
    if(isset($_POST["txtField"])){
      echo "OK";
    }else{
      echo "NOT OK";
    }
  }
 ?>

<html>
  <head>
    <title>Test Ground</title>
    <script type="application/javascript" src="https://code.jquery.com/jquery-2.2.2.min.js"></script>
    <script type="application/javascript" src="test.js"></script>
  </head>
  <body>
    <input type="text" id="txtField" />
    <input type="button" id="sendInput" value="Send" />
  </body>
</html>

test.js:

$(window).on("load", function(){
  $("#sendInput").on("click", sendInput);
});
function sendInput(){
  $.ajax({
    url: "test.php",
    method: "POST",
    data: {txtField: $("#txtField").val()}
  }).done(function(data){
    console.log(data);
  });
}

在我收到PHP到JS的响应之前，一切都很好。在console.log中，显示的数据还包括HTML代码以及PHP响应"OK"。但我只想要PHP的响应，不想要其他的。我知道我可以获取整个数据，删除HTML标记下的所有内容，或者为PHP创建一个单独的文件，但无论如何，它是否直接从PHP返回响应，而不创建单独的PHP文件。

您可以使用exit()函数来获得正确的返回：

  if ($_SERVER["REQUEST_METHOD"] == "POST") {
    if (isset($_POST["txtField"])) {
      echo "OK";
      exit();
    } else {
      echo "NOT OK";
    }
  }

当您发送Ajax调用时，服务器会返回文件上的所有打印值。所以HTML也打印出来了。与此类似，您只打印"OK"，因为exit()停止执行文件，并且只打印OK。

注意，当您使用AJAX时，使用单独的PHP文件和HTML文件更合适。

这样修改您的PHP文件：

<?php
  if($_SERVER["REQUEST_METHOD"] == "POST"){
    if(isset($_POST["txtField"])){
      echo "OK";
    }else{
      echo "NOT OK";
    }
  }
  // This is what i have added.
  if(isset($_GET["fromJS"]))
    die();
  // Till here, so if this GET param is set noting will come up further this.
 ?>

<html>
  <head>
    <title>Test Ground</title>
    <script type="application/javascript" src="https://code.jquery.com/jquery-2.2.2.min.js"></script>
    <script type="application/javascript" src="test.js"></script>
  </head>
  <body>
    <input type="text" id="txtField" />
    <input type="button" id="sendInput" value="Send" />
  </body>
</html>

并对test.php?fromJS=true 进行AJAX调用

$(window).on("load", function(){
  $("#sendInput").on("click", sendInput);
});
function sendInput(){
  $.ajax({
    url: "test.php?fromJS=true",
    method: "POST",
    data: {txtField: $("#txtField").val()}
  }).done(function(data){
    console.log(data);
  });
}

您需要两个php文件，一个用于ajax，另一个用于发送ajax的页面，如果您想坚持使用一个php页面，请尝试以下代码：

<?php
  if($_SERVER["REQUEST_METHOD"] == "POST"){
    if(isset($_POST["txtField"])){
      echo "OK";
    }else{
      echo "NOT OK";
    }
  } else {
 ?>

<html>
  <head>
    <title>Test Ground</title>
    <script type="application/javascript" src="https://code.jquery.com/jquery-2.2.2.min.js"></script>
    <script type="application/javascript" src="test.js"></script>
  </head>
  <body>
    <input type="text" id="txtField" />
    <input type="button" id="sendInput" value="Send" />
  </body>
</html>
<?php }?>