如何使用select和deselect按鈕在Javascript中添加和刪除動態數組中的元素？

Question

<div id="tables-box" class="module-box"> 
    <form method="POST" action="<?php echo current_url(); ?>"> 
     <?php echo lang('header');?> 
     <div class="btn-group-la" role="group" aria-label="First group" >  
     <?php 
     foreach ($tables as $table) 
     { 
      //table status 
      //0- busy (red) 
      //1- available (empty) 
      //2- waiting for check (light blue) 
      //3- done (blue) 
      //4- prepare (yellow) 

      $status = lang('status_available'); 
      switch ($table['table_status']) { 
       case 0: 
        $btn_class = "btn btn-danger btn-spacing"; 
        $btn_extra = "disabled"; 
        $status = lang('status_busy'); 
        break; 
       case 1: 
        $btn_class = "btn btn-success btn-spacing"; 
        $btn_extra = "data-toggle='button' aria-pressed='false'"; 
        $status = lang('status_available'); 
        break; 
       case 2: 
        $btn_class = "btn btn-info btn-spacing"; 
        $btn_extra = "disabled"; 
        $status = lang('status_check'); 
        break; 
       case 3: 
        $btn_class = "btn btn-primary btn-spacing"; 
        $btn_extra = "disabled"; 
        $status = lang('status_done'); 
        break; 
       case 4: 
        $btn_class = "btn btn-warning btn-spacing"; 
        $btn_extra = "disabled"; 
        $status = lang('status_prepare'); 
        break; 
      }  
     $btn = 'id="table_'.$table['table_id'].'" type="button" class="'.$btn_class.'" '.$btn_extra; 
     echo "<button ", $btn, ">"; 
     echo $table['table_name'], "<br/>"; 
     echo lang('persons'), " ", $table['max_capacity'], "<br/>"; 
     echo $status, "<br/>"; 
     echo "</button>"; 
     } 
     ?> 
      </div>  

      <span id="selected"><?php echo lang('select_table');?></span> 
      <input type="hidden" name="table_id" id="table_id" value="-1" /> 
      <input type="hidden" name="location_id" value="<?php echo $location_id;?>" /> 
      <input type="hidden" name="order_type" value="<?php echo $order_type;?>" /> 
      <div>   
      <input type="submit" id="btnSubmit" class="btn btn-primary" value="<?php echo lang('button_save');?>" disabled /> 
      </div> 
     </form> 
</div> 

腳本

<script type="text/javascript"><!-- 
    $(document).ready(function() {    
     <?php foreach ($tables as $table){?> 
     $("#table_<?php echo $table['table_id'];?>").click(function(){ 
      $('#selected').text('<?php echo lang('selected_table')." (".$table['table_name'].")";?>'); 
      $('#table_id').val('<?php echo $table['table_id'];?>'); 
      $('#btnSubmit').removeAttr('disabled'); 
      //alert($('#table_id').val()); 
     }); 
     <?php }?> 
    }); 
--></script> 

我有一組按鈕和每個按鈕與ID，我想選擇和取消選擇的按鈕。當我選擇一個按鈕時，它的ID將被添加到數組中，當我取消選擇一個按鈕時，它的ID將從同一個數組中移除，然後我將通過提交按鈕發佈這個數組。

Answer 1

我會創建兩個類。點擊切換類，並使用JavaScript添加或從數組中刪除，具體取決於哪個類按鈕。