var 的 Javascript 计数失败

Question

我在html 中有一个button，它由AJAX 设置一个新的tr 所以我构建了一个函数（下面的代码）来添加它，但现在我想要一个counter 来查看我有多少行， 向上counter 有效，在所有行的末尾我有一个“垃圾”图标，click 行消失（也可以正常工作）但向下计数器有一个issue 这是logic

15 14 12 9 5 0 -6 -13 -21 -30 -40 -51 -63 -76 -90

“通常从 15 到 1”

var partcount = 1;
$('#AddName').click(function () {

    partcount ++;
    $.ajax({
        type: "POST",
        url: "@Url.Action("addParticipantToForm", "Events")",
        success: function (data) {
            $('.table tr:last').after(data);
        },

    });
    console.log(partcount);
    document.getElementById("partisipants-counter").innerHTML = partcount;
});

这是在一页上

第二页是每次按下添加按钮时执行的，所以我必须在这里设置垃圾桶的脚本，否则它将无法工作

@model Livework.Web.Ticketing.ViewModels.CustomerViewModel
<tr>
<td>
    naam
</td>
<td>
    @Html.EditorFor(model  => model.thePartisipant.Name, new { htmlAttributes = new {       @class = "form-control" } })
</td>
<td>

    <button type="button" class="btn btn-default remove-name">
        <span class="glyphicon glyphicon-trash"></span>
    </button>
</td>
</tr>

<script>

$('.remove-name').click(function () {

    $(this).closest('tr').remove();
    partcount--;
    document.getElementById("partisipants-counter").innerHTML = partcount;
    console.log(partcount);
});
</script>

对不起，我的英语不好， 如果有任何问题，请告诉我 提前致谢

Answer 1

注意模式是如何“减一，再减二，再减三，再减四”...

这是因为您重复绑定事件处理程序，因此被调用的次数越来越多。

请尝试委派事件处理程序。类似
$(some container).click('.remove-name',function() {...});

Answer 2

正如我所说，你可以这样尝试：you can put your partcount value inside hidden element and when you want to decrement the value - get the value from that hidden element and subtract it by 1

假设你有隐藏字段：

<input type="hidden" id="count_hidden" value="1">

jquery：

    $('#AddName').click(function () {

        var partcount = parseInt($('#count_hidden').val());
        partcount ++;
        $('#count_hidden').val(partcount)
        // You code//

    });


    $('.remove-name').click(function () {

      $(this).closest('tr').remove();
       var partcount = parseInt($('#count_hidden').val());
       partcount--;
       $('#count_hidden').val(partcount);

       //your code
   });