javascript - 更改 HTML 的 JQuery 最近方法

Question

我正在做一个项目，我的视图中有两个锚点（用于投票功能），

我有一个 div，里面有一个<ul>，在 3 中，我有一个分别<li>用于 upvote、vote count(in <h2>)和 anchor downvote的锚

我想要功能，当我点击任何锚点时，h2 html 会显示投票计数，我已经实现了该功能，但是因为

我无法做到这一点，这是我的看法

<div class="voting" style="margin-left:20px;">
                                        <ul>
                                            <li class="addvote"><a href="#" class="voteAnswer" answerid="@answer.AnswerID" name="Voted">
                                           Up</a></li>
                                            <li class="votecounter">
                                                <h2>
                                                    @answer.AnswerLikes.Where(a => a.IsActive == true).Count()</h2>
                                            </li>
                                            <li class="subvote"><a href="#" class="voteAnswer" answerid="@answer.AnswerID" name="Voted">
Down</a></li>
                                        </ul>
                                    </div>

这是我的 JS

$(".voteAnswer").click(function (event) {
            var answerid = $(this).attr('answerid');
            var name = $(this).attr('name');
            var id = $(this).attr('id');
            var output = $(this);

                $.ajax({
                    url: ResourceAjaxUrl.VoteUnvoteTheAnswer,
                    type: "POST",
                    data: JSON.stringify({ answerID: answerid }),
                    dataType: "html",
                    contentType: "application/json; charset-utf-8",
                    success: function (Result) {
                        alert("Voted");
                        //  $(output).html("Voted (" + Result + ")");
                        $(output).closest("li").find("h2").html(Result);
                        $(output).attr("name", "Voted");
                    },
                    error: function (msg) {
                        alert("Unable to Vote answer: " + msg);
                    }
                });
event.preventDefault();
            });

我已经尝试使用 $(output).closest("li").find(".votecounter")但它仍然无法正常工作

Answer 1

UL 是最近的共同祖先。

尝试：

$(output).closest("UL").find(".votecounter")

Answer 2

你的代码有一些问题。

这里

$(".voteAnswer").click(function (event) {

            var id = $(this).attr('id');

没有id属性.voteAnswer

还有你如何区分upvote和downvote 。

您必须检查anchor's父li标签class并检查它是 upvote 还是 down vote 。

你也可以选择.votecounter

只需通过

$(".votecounter").find("h2").html(Result);

或者

$(output).closest("ul").find(".votecounter");