如何禁用所有未选中的复选框？

要禁用所有未选中的复选框，你可以使用JavaScript来实现这一功能。以下是一个简单的示例代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Disable Unchecked Checkboxes</title>
</head>
<body>
    <input type="checkbox" id="selectAll"> Select All
    <br>
    <input type="checkbox" class="checkbox"> Option 1
    <br>
    <input type="checkbox" class="checkbox"> Option 2
    <br>
    <input type="checkbox" class="checkbox"> Option 3
    <br>
    <script>
        document.getElementById('selectAll').addEventListener('change', function() {
            const checkboxes = document.querySelectorAll('.checkbox');
            checkboxes.forEach(checkbox => {
                checkbox.disabled = !this.checked;
            });
        });

        document.querySelectorAll('.checkbox').forEach(checkbox => {
            checkbox.addEventListener('change', function() {
                const allChecked = Array.from(document.querySelectorAll('.checkbox')).every(cb => cb.checked);
                document.getElementById('selectAll').disabled = !allChecked;
            });
        });
    </script>
</body>
</html>

解释

HTML部分:
- 创建一个全选复选框 (id="selectAll") 和多个普通复选框 (class="checkbox")。
- 每个复选框都有一个共同的类名 checkbox，以便通过JavaScript进行选择和操作。

JavaScript部分:
- 为全选复选框添加一个 change 事件监听器。当全选复选框的状态改变时，遍历所有普通复选框并根据全选复选框的状态启用或禁用它们。
- 为每个普通复选框添加一个 change 事件监听器。当任何一个普通复选框的状态改变时，检查所有普通复选框是否都被选中，并相应地启用或禁用全选复选框。