jQuery AJAX 发布数据

tpxzln5u  于 2023-03-07  发布在  jQuery
关注(0)|答案(2)|浏览(127)

我试图调用一个PHP文件时,一个按钮的onclick发生与一些参数。它是得到执行,直到警报语句在jsfile.js。之后, AJAX 部分是不会得到执行..

主文件.html

<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <script src="jsfile.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    </head>
    <body>
            <button onclick="cart(0)"> hi </button>
            <p id="disp"></p>
    </body>
</html>

js文件.js

function cart(id1) {
    var id = id1;
    alert("enterd " + id);
    document.getElementById("disp").innerHTML = "hi";
    $.ajax({
        url: "/add.php ",
        type: "POST",    
        data: {
            item_id: id,
        },
        success: function(response) {
            // document.getElementById("total_items").value = response;
            document.getElementById("disp").innerHTML = response;
        },
        error: function() {
            alert("error");
        }    
    });    
}

添加.php

<?php
    if(isset($_POST['item_id']) && !empty($_POST['item_id'])) {
    // if(count($_POST)>0)
        echo "success";
        exit();
    }
?>
jvidinwx

jvidinwx1#

在您的jsfile.js文件中,请更正以下几点,我在下面的代码中作为注解提到了这几点。

function cart(id1) {
    var id = id1;
    alert("enterd " + id);
    document.getElementById("disp").innerHTML = "hi";
    $.ajax({
        url: "/add.php ",
        method: "POST", // First change type to method here    
        data: {
            item_id: id,
        },
        success: function(response) {
            document.getElementById("disp").innerHTML = response;
        },
        error: function(error) {
            alert("error" + error);
        }
    });    
}
e0uiprwp

e0uiprwp2#

换一个试试

type:"POST" ->  method: "POST"

如果你的jquery版本是〉= 1.5,就这样使用它。

$.ajax({
  url: "add.php",
  method: "POST",
  data: { item_id: id},
}).done(function(response) {
  ......
}).fail(function( jqXHR, textStatus ) {
  ......
});

在JS文件之前加载Jquery。

相关问题