javascript - 如何使用 AJAX 成功函数更新动态创建的号码？

Question

我正在创建一个带有 mongo 后端的投票系统，我正在尝试弄清楚如何在投票后更新前端的数字。现在，数字正在使用 Handlebars 动态显示。在 .up 上单击 ajax 执行它的事情并将数据发送到服务器，然后返回 gameData。基本上，我希望我的 {{currentvote}} 号码在成功时更新。

$('.up').on('click', function() {
    var id = this.id;

    $.ajax({
        type: "POST",
        url: "/api/upvote",
        data: JSON.stringify({ cardId: id }),
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(gameData){
            console.log(gameData.currentvote + 1);

        },
        failure: function(errMsg) {
            alert(errMsg);
        }
    });
});

<div class="col-lg-12">
    <div class="row">
    <div class="up" id="{{ID}}"><i class="fas fa-chevron-circle-up color-gray upvote"></i></div>
    <div class="down" id="{{ID}}"><i class="fas fa-chevron-circle-down color-gray downvote"></i></div>
    <div class="margin-left"><p class="vote-number" id="green">{{currentvote}}</p></div>
    </div>
</div>

Answer 1

正如您在 jquery ajax 中所做的那样，您也应该通过 jquery 完成它。你可以像这样轻松地做到这一点:

success: function(gameData){
    var currentVote = $(".vote-number").text();
    $(".vote-number").text( parseInt(currentVote) + parseInt(gameData.currentvote) + 1 );
}