如果没有单击复选框，如何禁用按钮

How to disable a button if no checked boxes are clicked

本文关键字：何禁用 按钮 单击 复选框 如果没有      更新时间：2023-09-26

我有复选框列在我的数据表，我想隐藏一个按钮，如果没有复选框单击。(包括分页)。下面是我的代码，我用来获取点击按钮时的值，请建议，

$('#button').click(function () {
    var id = "";
    var oTable = $("#userTable").dataTable();
    $(".groupCheckBox:checked", oTable.fnGetNodes()).each(function () {
        if (id != "") {
            id = id + "," + $(this).val();
        } else {
            id = $(this).val();
        }
    });
});

您可以向所有复选框添加事件侦听器。当某些内容发生变化时，检查它们是否都未选中=>禁用按钮，否则=>启用按钮。

$(".groupCheckBox").on('change', function(){
    if($(".groupCheckBox:checked", oTable.fnGetNodes()).length == 0){
        $('#merge_button').prop('disabled', true);
    }else{
        $('#merge_button').prop('disabled', false);
    }
});

默认禁用$('#merge_button')，并为所有$('.groupCheckBox')元素设置change事件侦听器。在事件处理程序中，检查是否有复选框被选中以更新按钮属性:

$('.groupCheckBox').on('change', function() {
  $('#merge_button').prop('disabled', $('input.groupCheckBox:checkbox:checked').length === 0);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" class="groupCheckBox">
<input type="checkbox" class="groupCheckBox">
<input type="checkbox" class="groupCheckBox">
<input type="checkbox" class="groupCheckBox">
<input type="checkbox" class="groupCheckBox">
<input type="checkbox" class="groupCheckBox">
<input type="checkbox" class="groupCheckBox">
<input type="checkbox" class="groupCheckBox">
<hr>
<button id="merge_button" disabled>Merge</button>

相关文章：