Javascript Jquery/Ajax相关的“喜欢”和“不喜欢”按钮查询

在我的应用程序中，我有一些用户评论，来宾用户可以查看它们并选择喜欢/不喜欢它们。jsp中的部分当前代码如下所示

<div class="row mtop20">
            <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
                    <p class="info">
                        Was this review helpful? <i class=" fa fa-thumbs-up" id="${review.id}"></i>
                        Yes <i class=" fa fa-thumbs-down" id="${review.id}"></i> No <br>
                        <div id="vote_already_${review.id}" style="display: none;">Your have already voted.</div>                                           
                        <div id="vote_recorded_${review.id}" style="display: none;">Thanks for your vote!</div>
                        <c:choose>
                            <c:when test="${empty review.helpfulReviewCounter}">
                                    <c:set var="helpfulReviewCounter" value="0"></c:set>
                            </c:when>
                            <c:otherwise>
                                    <c:set var="helpfulReviewCounter"
                                                    value="${review.helpfulReviewCounter}"></c:set>
                            </c:otherwise>
                        </c:choose> 
                        <c:choose>
                            <c:when test="${empty review.notHelpfulReviewCounter}">
                                <c:set var="notHelpfulReviewCounter" value="0"></c:set>
                            </c:when>
                            <c:otherwise>
                                <c:set var="notHelpfulReviewCounter"
                                                    value="${review.notHelpfulReviewCounter}"></c:set>
                            </c:otherwise>
                        </c:choose>
                        <c:set var="totalReviewsCounter"
                                            value="${helpfulReviewCounter + notHelpfulReviewCounter}"></c:set>
                        <span>${helpfulReviewCounter} of
                                            ${totalReviewsCounter} users found this review helpful</span>
                    </p>

             </div>
 </div>

这篇评论有用吗？
是否

你已经投票了。
谢谢你的投票！
的${helpfulReviewCounter}
${TotalReviewCounter}用户认为此评论很有帮助

我不太擅长jQuery和Ajax。我想调用一个javascript/jQuery/Ajax方法，单击“Like”按钮（类fa竖起大拇指），它将调用后端代码，如果后端代码成功，则更新给定评论的helpfulReviewCounter和TotalReviewCounter

我的技术堆栈是SpringMVC、hibernate、jQuery、ajax、html5、css3

---

提前感谢您的帮助。

如果没有更多信息，我无法帮助您使用服务器端代码，但此JS有望帮助您：

<script>
$(function() {
  $('.fa-thumbs-up').on('click', function() {
    $.post('/api/like', {id: this.id});
  });

  $('.fa-thumbs-down').on('click', function() {
    $.post('/api/dislike', {id: this.id});
  });
});
</script>

$（函数（）{
$（'.fa竖起大拇指'）。在（'click'，function（）上{
$.post（'/api/like'，{id:this.id}）；
});
$（'.fa拇指朝下'）。在（'click'，function（）上{
$.post（'/api/disfect'，{id:this.id}）；
});
});

---

显然，更改API路径以适合您的后端。

我可以处理服务器端代码。这只是我与之斗争的客户方面。根据您的代码，我可以通过单击向上和向下按钮看到对服务器端的调用。但它仍然没有显示如何为给定的审阅更新helpfulReviewCounter和TotalReviewCounter（一旦服务器端代码完成其工作）。谢谢你的帮助。模板引擎是什么？我正在使用的标记库是什么。对不起，我想我帮不了你，我不熟悉。不过祝你好运。谢谢你抽出时间，马特