Question

我肯定这很明显，但是我无法弄清楚

按钮上的onretrieveScoreButton的单击，我的按钮根本什么也没做

感谢任何帮助，我试图将数据追加到表中，但是甚至无法获取它来注册按钮的单击，因此我无法测试功能showscore

<button id="addScoreButton">Add score</button>
<button id="retrieveScoreButton">Retrieve all scores</button>
<br>

<div id="Scores">
<ul id="scoresList">
</ul>
</div>

<script>
$(document).ready(function () {
    $("#addScoreButton").click(function () {
            $.ajax({
                    type: 'POST',
                    data: $('form').serialize(),
                    url: '/addScore',
                    success: added,
                    error: showError
                }
            );
        }
    );
});



$(document).ready(function () {
    $("#retrieveScoreButton").click(function () {
            console.log(id);
            $.ajax({
                    type: 'GET',
                    dataType: "json",
                    url: "/allScores",
                    success: alert("success"),
                    error: showError
                }
            );
        }
    );
});

function showScores(responseData) {
        $.each(responseData.matches, function (scores) {
                $("#scoresList").append("<li type='square'>" +
                    "Home Team " + matches.Home_Team +
                    "Away Team: " + matches.Away_Team +
                    "Home: " + scores.Home_Score +
                    "Away: " + scores.Away_Score
                );

            }
        );
    }

function showError() {
        alert("failure");
    }


</script>

</body>

</html>

Answer 1

这里有几处错误：

console.log(id);
$.ajax({
    type: 'GET',
    dataType: "json",
    url: "/allScores",
    success: alert("success"),
    error: showError
});

首先，您从未定义id。（在对问题进行一些评论后，您的浏览器控制台正在告诉您。）您尝试登录什么？您也可以完全删除该行。

第二，您在这里期望什么？：success: alert("success")这里要发生的是alert()将立即执行（甚至在发送AJAX调用之前）然后警报的结果（即undefined）将成为您成功的处理程序。您需要在AJAX响应后调用处理程序函数，并且那个函数可以包含警报。

类似这样的东西：

$.ajax({
    type: 'GET',
    dataType: "json",
    url: "/allScores",
    success: function() { alert("success"); },
    error: showError
});

（为说明差异，将当前的成功处理程序与当前的错误处理程序进行比较。其中一个使用括号调用该函数，另一个不使用括号。您不想立即调用一个处理函数，您想将其设置为该事件发生时稍后调用的处理程序。）

HTML Ajax按钮什么都不做

1 个答案: