javascript - 实现一个 Jquery 计数器

Question

所以我对 Web 开发还很陌生，我正在尝试实现一个计数器，该计数器在选择项目时增加，但在未选择所选项目时减少。当项目被选中时，我的计数器会增加，但当项目未被选中时，计数器似乎无法下降(它仍然计数)我的代码在下面(请原谅我说我是新手有多糟糕)

//highlights current selection and alows a choice of 4 seats to be made
//need to implement unselecting a seat
$('td.n').click(function(){
  if(checkcounter())
  {
    $(this).toggleClass('selected'); 
    $('#seatsAlloc').text(SeatAlloc.toString());    
  }  
});

//cycles through all the seats to check if they are taken or available
//adds taken class to all taken seats
for(x=0;x<=139;x++)
{
    if (d.alloc[x] == 1)
    {
      $($('td.n')[x]).addClass('taken');
    }
}

var SeatAlloc = 0;
var Seat_Counter = 0;
function checkcounter()
{
  if(Seat_Counter < 4)
  {
    Seat_Counter++;
    SeatAlloc++;
    return true;
  }
    Seat_Counter--;
    SeatAlloc--;
    return false;
} 

如果有人能提供帮助，我们将不胜感激谢谢!

Answer 1

$('td.n').click(function(){
  $(this).toggleClass('selected'); 
  $('#seatsAlloc').text($('td.selected').length);    
});

此代码将“selected”类删除或添加到按下的 td，然后它简单地计算类“selected”的 td 的数量。

是的，可以这么简单。

因此，如果您希望最多选择 4 个席位，您可以执行以下操作。

    $('td.n').click(function(){
      var amountSelected = $('td.selected').length;
      if(amountSelected <= 4) {
          $(this).toggleClass('selected'); 
          $('#seatsAlloc').text($('td.selected').length); 
      }   
    });