Question

我有一个ajax函数，应该将一些数据发布到另一个页面，但由于某种原因它似乎没有发布。

我不知道为什么这不起作用我过去一小时都在看它。

Ajax功能

$(document).ready(function()
{
    $('.rate').click(function(){
        var ratingId = $('#ratingID').val();
        var clickBtnValue = $(this).val();
        var ajaxurl = 'ProcessRating.php',

        data =  {'action': clickBtnValue, 'ratingID': ratingId};

        $.post(ajaxurl, data, function (response)
        {
            alert("action performed successfully");
        });
    });
});

在主页上

<?php
 session_start();
 echo $_SESSION["messege"];
?>
<html>
<head>
    <title>TODO supply a title</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script 
    src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js">
    </script>
    <script> 
     //The Ajax function is here
    </script>
</head>

<body>
    <form>
    <input type="hidden" class="rate" id="ratingID" name="ratingID" value = 
    "<?php echo $article->getId()?>" />
    <input type="submit" class="rate" name="1" value="1" />
    <input type="submit" class="rate" name="2" value="2" />
    <input type="submit" class="rate" name="3" value="3" />
    <input type="submit" class="rate" name="4" value="4" />
    <input type="submit" class="rate" name="5" value="5" />
    </form>
</body>

在ProcessRating.php页面上

<?php
session_start();

$_SESSION["messege"] = "got This far";

if (isset($_POST['action'])) 
{
    $id = $_POST['ratingID'];

    switch ($_POST['action']) {
        case '1':
            updateRating($db, $id, "oneStar");
            break;
        case '2':
            updateRating($db, $id, "twoStar");
            break;
        case '3':
            updateRating($db, $id, "threeStar");
            break;
        case '4':
            updateRating($db, $id, "fourStar");
            break;
        case '5':
            updateRating($db, $id, "fiveStar");
            break;
    }

    $rating = getAvgRating($db, $id);
    updateArticleRating($db, $id, $rating);
}

Answer 1

1.由于所有按钮类型均为submit且位于<form></form>内。因此您必须使用preventDefault()来阻止正常的表单发布。

如下所示： -

$(document).ready(function(){
    $('.rate').click(function(e){
        e.preventDefault();
        var ratingId = $('#ratingID').val();

        var clickBtnValue = $(this).val();

        var ajaxurl = 'ProcessRating.php',

        data =  {'action': clickBtnValue, 'ratingID': ratingId};

        $.post(ajaxurl, data, function (response){
            alert("action performed successfully");
        });
    });
});

2.确保ajaxurl在那里是正确的。（检查控制台，如果URL中有错误，您将在控制台中看到错误）

重要提示： -

检查浏览器控制台，看是否有错误？如果是，请告诉我们。

Answer 2

根据评论中的建议，请检查通过控制台返回脚本的内容。您可以这样使用console.log(response)

jQuery.ajax({
    type: "POST", 
    url: "http://url", 
    data: "action=foobar",
    success: function(response){
        console.log(response);
    }
});

现在，您可以检查控制台以获取返回响应。

ajax没有张贴到页面

2 个答案: