将div onsubmit中的值加1

Question

我有一个论坛，人们可以评论其他人的条目，我通过ajax将数据提交到数据库。我有一个名为"total_number"的div，它包含对特定主题的响应总数。我有一个脚本，在单击提交按钮时，它会在total numberdiv中的数字上加1。

现在我的问题是，由于主题区域是嵌套的，我发现当点击某一行的按钮时，很难对其进行计数。例如，当我点击第一行的提交按钮时，它会正确相加，但当我点击第二行的下一个按钮时，计数不起作用。因此，我需要找到一个可以弥补嵌套记录的脚本，这样当它的按钮被点击时，它就可以算作一个特定的行。我设法在total_numberdiv中添加了+1，所以当每个div重复时，它都会添加+1

$(document).ready(function(){
    $('.form1').on('submit',function(event){
        event.preventDefault();
        // Disable submit button on this specific form
        $('.button-add', this).text('Submitted').prop('disabled', true);
        data = $(this).serialize();
        $.ajax({
        type: "POST",
        url: "insert_comment.php",
        data: data
        }).success(function() {
              window.counter=parseInt($('#total_number').html());
            window.counter++;
            $('#total_number').html(window.counter);


        });
    });
});

Answer 1

如果你的注释有一个类，你总是可以计算出其中有多少个对象。

例如：

var count = $(".comment-wrapper").length;

现在，您是否需要添加1，取决于您是在添加新评论之前还是之后添加。考虑到它在success中，我假设它在后面，所以你不需要添加1。

Answer 2

如果每一行都有一个计数器，并且希望每一行独立求和（只有自己行中的注释），那么在成功函数中，找到相关提交按钮前的total_number元素（使其成为一个类），获取其html，解析并增加一：

$('.btn').click(function() {
  $check = $(this).prevAll('.total_number:first');
  var counter = parseInt($check.html());
  counter++;
  $check.html(counter);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="total_number">4</div>
<button class="btn">CLICK ME</button>
<div class="total_number">12</div>
<button class="btn">CLICK ME</button>