我的Ajax代码中有一个bug，其中有两个脚本，无法找到它

页面上的barrating按其应有的方式工作-视觉上。 单击星号时，不会发生任何事情，也不会调用ajax。 我昨天意识到这两个脚本的冲突，现在应该用$b来解决。 但是，我的PHP页面没有显示预期的评级值

我想我可能对Ajax调用、按摩表单/按摩评级有错误的参考，什么都不起作用。 我有点迷路了，已经看了好几天了，可能会睁大眼睛盯着它看。 在我看来，这似乎是正确的，但没有结果，这是不正确的

在第二个脚本、on.click等上尝试了多种解决方案，但均无效

<link rel="stylesheet" href="css-stars.css">
<script src="jquery-3.4.1.min.js"></script>
<script src="jquery.barrating.min.js"></script>
<script type="text/javascript">
    var $b = $.noConflict(true);
</script>

<form id="massage-form">
    <select id="massage-rating" name="stars" method="POST">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
        <option value="5">5</option>
    </select>
    <input type="hidden" type="submit" type="button" id="submit-button">
</form>
<script type="text/javascript">
    $b(function() {
        $("#massage-rating").barrating({
        theme: 'css-stars'
        });
        $('select').barrating();
        $('select').barrating('set', 4);
        showSelectedRating: true;
    });
</script>

<script type="text/javascript">
    $("#massage-form").on('submit', function(event){
        event.preventDefault();
        var formData = $(this).serialize();
        $.ajax({
            type: 'POST',
            url: './review/create_star_rating.php',
            data: formData,
                success: function(response){
                    window.setTimeout(function(){window.location.reload()},1000);
            }
        });
    });

不是完整的代码，只是这个特定的片段

如有任何建议/解决方案，将不胜感激。我认为这是最简单的解决方案，但我看不出来

对Ajax来说比较新，但无论如何阅读量很大

我从中得到了灵感：

Ajax代码已修复

工作

<link rel="stylesheet" href="css-stars.css">
<script src="jquery-3.4.1.min.js"></script>
<script src="jquery.barrating.min.js"></script>

<form id="massage-form" Method="POST">
    <select id="rating" name="stars">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
        <option value="5">5</option>
    </select>
</form>

<script type="text/javascript">
$(function() {
    $("#rating").barrating({
        theme: 'css-stars',
        initialRating: 4,
        onSelect: function(value){
            $.ajax({
                type: 'POST',
                url: './review/create_star_rating.php',
//              dataType: 'json',
                data: {number: value},
                success: function(data, textStatus, jqXHR){
                    alert('Thank you for your rating');
//                  alert(jqXHR.responseText);
//                  window.setTimeout(function(){window.location.reload()},1000);
                },
                error: function(xhr){
                    alert(xhr.status +" :" + xhr.responseText);
                }
            });
        }
    });
})
</script>

1.
2.
3.
4.
5.
$（函数（）{
美元（“#评级”）。拦河坝({
主题:"css明星",，
初始评级：4，
onSelect：函数（值）{
$.ajax({
键入：“POST”，
url:“./review/create_star_rating.php”，
//数据类型：“json”，
数据：{number:value}，
成功：函数（数据、文本状态、jqXHR）{
警惕（“感谢您的评分”）；
//警报（jqXHR.responseText）；
//setTimeout（函数（）{window.location.reload（）}，1000）；
},
错误：函数（xhr）{
警报（xhr.status+“：”+xhr.responseText）；
}
});
}
});
})

现在修复我的php代码，使其按预期工作，但无论如何，这是在管道中。 如果其他人有类似的问题，我将此留在这里。

不要遵循phpzag.com教程！他们鼓吹糟糕的编程实践，他们的代码样本充满了安全问题。请先了解一下。

<link rel="stylesheet" href="css-stars.css">
<script src="jquery-3.4.1.min.js"></script>
<script src="jquery.barrating.min.js"></script>

<form id="massage-form" Method="POST">
    <select id="rating" name="stars">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
        <option value="5">5</option>
    </select>
</form>

<script type="text/javascript">
$(function() {
    $("#rating").barrating({
        theme: 'css-stars',
        initialRating: 4,
        onSelect: function(value){
            $.ajax({
                type: 'POST',
                url: './review/create_star_rating.php',
//              dataType: 'json',
                data: {number: value},
                success: function(data, textStatus, jqXHR){
                    alert('Thank you for your rating');
//                  alert(jqXHR.responseText);
//                  window.setTimeout(function(){window.location.reload()},1000);
                },
                error: function(xhr){
                    alert(xhr.status +" :" + xhr.responseText);
                }
            });
        }
    });
})
</script>