本文介绍如何使用 jquery 和 html 结构化分组，实现“同一天仅可选一个班次”的交互逻辑：当用户勾选某天（如 monday）的任一班次时，自动禁用并取消勾选该天其他班次的复选框，确保数据一致性与操作安全性。

本文介绍如何使用 jquery 和 html 结构化分组，实现“同一天仅可选一个班次”的交互逻辑：当用户勾选某天（如 monday）的任一班次时，自动禁用并取消勾选该天其他班次的复选框，确保数据一致性与操作安全性。

在课程排期、班次分配等业务场景中，常需限制用户“每天最多选择一个班次”。虽然语义上更推荐使用 ，但若因历史原因或后端兼容性必须保留 type="checkbox"，则可通过按星期分组 + JavaScript 事件控制实现精准互斥逻辑。

✅ 核心思路：结构先行，逻辑后置

关键不在于监听所有 checkbox，而在于将同属一天的 checkbox 归入同一容器（如

），再为每个容器绑定独立的互斥行为。这样可避免全局冲突，也便于未来扩展（如按日期、教师等维度分组）。

✅ 前端实现（HTML + jQuery）

首先，修改 PHP 渲染逻辑，按 batch_day 动态分组输出：