Javascript 如何使用AJAX将数据发布到php文件

我无法将数据发送到要处理的php文件。我尝试了几乎所有的方法，但找不到问题的根源。下面是一个php文件，在用户单击“购买”按钮后，该文件会将产品名称、价格和ID发送到

checkout

函数

我正在使用MAMP的phpMyAdmin数据库。我的url不正确吗？我试过使用

”http://localhost:8888/checkout.php“

和checkout.php。下面是我需要处理数据的php文件。为了简单地学习如何发送数据，我只是在文件中回音，以确保它确实在发布。但没有任何回应

<?php 

  session_start();
  $servername = "localhost";
  $username = "root";
  $password = "root";
  $dbname = "Test";

  // Create connection
  $conn = new mysqli($servername, $username, $password, $dbname);

  // Check connection
  if ($conn->connect_error) {
   die("Connection failed: " . $conn->connect_error);
 } 

  $theProduct_Name = $_POST['Product_Name'];
  $theProduct_ID = $_POST['Product_ID'];
  $thePrice = $_POST['Price'];

 echo $theProduct_Name.$theProduct_ID.$thePrice;

 ?> 

---

我是新的网络编程，所以任何帮助或提示将不胜感激。我已经看了几个小时了，似乎无法让它工作。

您的代码应该有以下更改

$.ajax({
        method: "POST",
        url: "http://localhost:8888/checkout.php",
        data: {"Product_Name": "theProduct_Name", "Price": "thePrice", "Product_ID": "theProduct_ID"},
        success : function(responseText)
                  {
                    alert('success to reach backend');
                    // you can console the responseText and do what ever you want with responseText
                    console.log(responseText);
                  },
        error : function(jqXHR, status, error){
                    if (jqXHR.status === 0) {
                        alert('Not connected.\nPlease verify your network connection.');
                    } else if (jqXHR.status == 404) {
                        alert ('The requested page not found. [404]');
                    } else if (jqXHR.status == 500) {
                        alert ('Internal Server Error [500].');
                    } else if (exception === 'parsererror') {
                        alert ('Requested JSON parse failed.');
                    } else if (exception === 'timeout') {
                        alert ('Time out error.');
                    } else if (exception === 'abort') {
                        alert ('Ajax request aborted.');
                    } else {
                        alert ('Uncaught Error.\n' + jqXHR.responseText);
                    }
                 }
      });

---

您可以在浏览器控制台中跟踪ajax请求。它将向您显示请求和响应以及从php脚本接收到的错误。

---

如果单击按钮，您无法在控制台中看到任何请求，请尝试使用“方法”而不是“类型”。一些较旧的jquery版本不支持类型

method:“POST”，

使用Ajax时，请求由Ajax发送，您可以在success方法中看到响应。对操作URL的任何直接调用都将发送新的请求，在本例中，该请求为空

window.location.assign("http://localhost:8888/checkout.php")

删除这行代码，然后像下面那样更改jQuery.Ajax以查看响应

var request = $.ajax({
    type: "POST",
    url: "http://localhost:8888/checkout.php",
    data: {Product_Name: theProduct_Name, Price: thePrice, Product_ID: theProduct_ID},
    dataType: "html"
});

request.done(function(msg) {
  alert ( "Response: " + msg );
});

request.fail(function(jqXHR, textStatus) {
  alert( "Request failed: " + textStatus );
});

---

我测试了您的代码，它工作正常，ajax请求正常发生，请尝试从javascript代码中删除这一行。 window.location.assign（“”）

我使用这个版本的jQuery：

在Google Inspector的网络选项卡中，我看到：

Request:
Request URL:http://localhost:8888/checkout.php
Request Method:POST
Status Code:200 OK
Remote Address:127.0.0.1:8888

Response:
Bike150

---

如果未工作，请告知我收到状态错误：0。这不说明我没有连接。这意味着你的url不正确。。。。。这个文件真的存在于您的文件中吗？它在我的测试示例中工作，如果您需要，我可以为您上传。您好，先生，如果数据没有发布，请删除contentType:“application/json”。。。删除该行您不应期望通过直接调用操作url看到任何回音。您正在发送Ajax，它会返回响应。@MateHegedus更好的方法是使用直接将数据发送到php文件的表单，而不是先将数据发送到函数，然后再使用Ajax？@NMoeini我知道，但当我调用'window.location.assign（

）时http://localhost:8888/checkout.php“

）“在ajax返回后，数据不应该被回显吗？不。因为它在第二次呼叫中什么也不发送。第二次调用时请求为空。@NMoeini那么代码应该可以工作了，我就是看不到？如何验证我的数据是否已发布？此解决方案有效。由于我的无知，我没有意识到它仍然会更新数据库，谢谢你指出这一点！

var request = $.ajax({
    type: "POST",
    url: "http://localhost:8888/checkout.php",
    data: {Product_Name: theProduct_Name, Price: thePrice, Product_ID: theProduct_ID},
    dataType: "html"
});

request.done(function(msg) {
  alert ( "Response: " + msg );
});

request.fail(function(jqXHR, textStatus) {
  alert( "Request failed: " + textStatus );
});

Request:
Request URL:http://localhost:8888/checkout.php
Request Method:POST
Status Code:200 OK
Remote Address:127.0.0.1:8888

Response:
Bike150