如何查看复选框是否被切换并根据它执行操作，在使用 jquery 的数据表中？

Question

我有一个按钮，我需要根据是否选中我的数据表中的任何复选框来隐藏或显示它，

<input type = "submit" id = "update-button" class = "ml-5 btn btn-warning" value = "Update Selected" style = "color: white" hidden>

我将这两个用于我的数据中的复选框table

<script src="https://cdn.datatables.net/1.10.21/js/jquery.dataTables.min.js"></script>
  <script type="text/javascript" src="//gyrocode.github.io/jquery-datatables-checkboxes/1.2.12/js/dataTables.checkboxes.min.js"></script>

我现在已经像这样定义了我的 DataTable，

var table = $("#classroom_teachers_table").DataTable({
      "processing": true, 
      "paging": true,
      "serverSide": true, 
      "info": false,
      "ajax": {
        url: "action.php", 
        method: "POST", 
        data: {action: "get_classroom_teachers"},
      },
      'columnDefs': [
         {
            'targets': 0,
            'checkboxes': {
               'selectRow': true
            }
         }
      ],
      'select': {
         'style': 'multi'
      },
      'order': [[1, 'asc']]
      
    });

我现在想要的是检查是否单击了任何复选框...也就是说，每当单击 checkbox 时，我想创建一个“打开”功能用户。然后该函数将检查数据table中勾选的复选框的数量。如果数字大于 0，它将 显示输入按钮 （通过删除隐藏属性），如果不是，则将隐藏属性更改为 true...

但我不明白 我应该如何称呼这个函数？ 喜欢，

$("#classroom_teachers_table tbody).on("click", function(){ 

*function*

)};

我应该写什么而不是 #classroom_teachers_table tbody 以便仅当复选框为 clicked/unclicked?

时才调用此函数

另外，我可以在 table 内完成吗？而不是创建一个全新的 Jquery 函数？

Answer 1

如果我没看错的话，这就是你要找的：

$(document).ready(function() {
   var table = $('#example').DataTable({
      'ajax': 'https://gyrocode.github.io/files/jquery-datatables/arrays_id.json',
      'columnDefs': [
         {
            'targets': 0,
            'checkboxes': {
               'selectRow': true,
               'selectCallback': function(nodes, selected) {
                  
                  var rows_selected = table.column(0).checkboxes.selected();
                  if(rows_selected.length > 0) $("#update-button").show();
                  else $("#update-button").hide();
               }
            }
         }
      ],
      'select': 'multi',
      'order': [[1, 'asc']]
   });
});

<link href="https://cdn.datatables.net/1.10.21/css/jquery.dataTables.min.css" rel="stylesheet"/>
<link href="https://gyrocode.github.io/jquery-datatables-checkboxes/1.2.10/css/dataTables.checkboxes.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdn.datatables.net/1.10.21/js/jquery.dataTables.min.js"></script>
<script src="https://gyrocode.github.io/jquery-datatables-checkboxes/1.2.10/js/dataTables.checkboxes.min.js"></script>

<input type="submit" id="update-button" class="ml-5 btn btn-warning" value="Update Selected" style="color: white; display: none;">
<br><br>
<table id="example" class="display" cellspacing="0" width="100%">
   <thead>
      <tr>
         <th></th>
         <th>Name</th>
         <th>Position</th>
         <th>Office</th>
         <th>Extn</th>
         <th>Start date</th>
         <th>Salary</th>
      </tr>
   </thead>
   <tfoot>
      <tr>
         <th></th>
         <th>Name</th>
         <th>Position</th>
         <th>Office</th>
         <th>Age</th>
         <th>Start date</th>
         <th>Salary</th>
      </tr>
   </tfoot>
</table>

注意： 由于某些原因 hidden 属性在代码段中不起作用，所以我不得不使用 CSS显示属性，为了show/hide你的按钮。

如何查看复选框是否被切换并根据它执行操作，在使用 jquery 的数据表中？

How to see if checkbox is toggled and perform action according to that, in datatables using jquery?

javascript

jquery

datatables

jquery-datatables-checkboxes