javascript - onsubmit 影响特定行的类

Question

我的页面有嵌套记录，并且每个嵌套记录在名为 “count” 的 div 中的每条记录都有点击总数。我想将 view 类的按钮的每个 div onclick 总数加 1。目前我正在实现的是 onclick 按钮 View ，1 被添加到所有嵌套的 count div 中，但我希望它影响我单击 View 按钮的特定行

$(document).ready(function(){



$('.view').click(function() {
 counter=parseInt($('.count').html());
            counter++;
            $('.count').html(counter);



        });
    });

html

 <table width="200" border="1">
  <tr>
    <td><div>4</div></td>
  </tr>
  <tr>
    <td><button class="view">CLICK ME</button></td>
  </tr>
  <tr>
    <td><div>12</div></td>
  </tr>
  <tr>
    <td><button class="view">CLICK ME</button></td>
  </tr>
</table>

Answer 1

如果没有 ID，您可以使用 parent()和prev()访问表中的上一行，然后使用 find() 深入到您的 div .

如果有多个<div>在你的行中，然后要么

1. 使用find("div").eq(x)其中 x 是您想要从 0 开始的 div 索引 ( ref )。

2. 为 div 指定一个类名，例如 <div class="count_holder">然后你可以做 find("div.count_holder") .

试试这个:

$(document).ready(function() {

  $('.view').on("click", function() {
    $target = $(this).parent().parent().prev().find("div").eq(1);
    counter = parseInt($target.html());
    counter++;
    $target.html(counter);
  });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table width="200" border="1">
  <tr>
    <td>
      <div>Count:</div>
      <div>4</div>
    </td>
  </tr>
  <tr>
    <td>
      <button class="view">CLICK ME</button>
    </td>
  </tr>
  <tr>
    <td>
      <div>Count:</div>
      <div>12</div>
    </td>
  </tr>
  <tr>
    <td>
      <button class="view">CLICK ME</button>
    </td>
  </tr>
</table>