javascript - 如果单击 div 计数会增加，我没有元素。同时点击其他div，第一个div计数会是0吗？

Question

您可以存储 [data][1] 每个元素计算每个元素被点击的次数。

$('.container').click(function() {
  if ($(this).data('count')) { // already been clicked
    $(this).data('count', $(this).data('count') + 1); // add one
  } else { // first click
    $(this).data('count', 1); // initialize the count
  }
  $(this).html($(this).data('count')); // show it
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container">container</div>
<div class="container">container</div>
<div class="container">container</div>
<div class="container">container</div>
<div class="container">container</div>
<div class="container">container</div>

标签： javascriptjqueryfrontendweb-frontend

Answer 1

1. 只需在第二次单击时将其他数据设置为 0

$('.container').click(function() {

  if ($(this).data('count')) { // already been clicked
    
    $(this).data('count', $(this).data('count') + 1); // add one
  } else { // first click
    $('.container').not(this).data('count', 0);
    $(this).data('count', 1); // initialize the count
  }
  $('.container').each(function(i, v) {
    $(v).html($(v).data('count')); // show it
  })



});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container">container</div>
<div class="container">container</div>
<div class="container">container</div>
<div class="container">container</div>
<div class="container">container</div>
<div class="container">container</div>