label点击后input的change事件不触发的根本原因是label与input未建立有效绑定链：for属性值必须与input的id逐字节一致，input必须有id而非name，动态渲染时需确保SSR与hydration的id一致，Portal或Fragment会导致DOM子树分离使for失效；隐藏input时禁用display:none或visibility:hidden，应使用绝对定位移出视口；移动端需避免pointer-events:none、user-select:none等CSS干扰，label须设inline-block和padding以扩大热区；动态插入的checkbox必须用事件委托绑定change事件，且handler中实时查询状态、避免箭头函数导致this丢失。
label 点击后 input 的 change 事件不触发
根本不是事件监听写错了，而是 label 和 input 之间没真正建立可触发状态变更的绑定链。浏览器只在 input 元素的 checked 或 value 属性**真实改变**时才派发 change 事件，而 label 能否促成这个改变，完全取决于它是否合法“驱动”了目标控件。
-
for属性值必须与目标input的id字符串**逐字节一致**：大小写、连字符、下划线都不能错，id="agree-terms"配for="agree-terms"才有效；id="agree_terms"或id="AgreeTerms"都会静默失效 - 目标
input必须有id，只设name不行——for完全不看name - 动态渲染（React/Vue）中，若
id是运行时生成但for值写死，或 SSR 渲染的id与客户端 hydration 后不一致，首次点击必失败 - 使用
Portal或 Fragment 渲染时，label和input实际不在同一 DOM 子树，for绑定彻底失效（DevTools 里能明显看到它们分属不同根节点）
input 被隐藏后 change 事件丢失
用 display: none 或 visibility: hidden 隐藏 input，会导致部分浏览器（尤其是 Android 原生 WebView）完全跳过状态同步，change 事件永不触发——这不是 bug，是规范行为：不可见、不可交互的元素不参与表单事件流。
- 正确隐藏方式：
position: absolute; left: -9999px; width: 1px; height: 1px;，确保元素仍在 DOM 流中且可被焦点/状态系统识别 - 避免
opacity: 0; pointer-events: none组合：后者会切断安卓上 label 点击到 input 的事件传递链 - 禁用
clip-path: inset(50%)等非标准裁剪方式，部分安卓浏览器对其支持不完整，:checked和change可能同时失灵
移动端真机点击无响应的 CSS 干扰项
iOS Safari 和部分 Android WebView 对事件冒泡路径更敏感，以下样式会让 label 表面可点、实则无法穿透到 input：
-
pointer-events: none设在label自身、其任意父级，或因z-index错乱被遮挡层盖住 -
user-select: none—— 某些 Android WebView 会连带抑制 click 冒泡；应改用-webkit-user-select: none+-moz-user-select: none，保留标准属性为text -
label默认是 inline 元素，热区极小；手指点在文字边缘易落空，必须加display: inline-block和显式padding撑开可点击区域
动态插入 checkbox 后 change 事件绑不上
直接对新插入的 input[type="checkbox"] 用 $("...").change(...) 会失效，因为元素插入前选择器已执行完毕，jQuery 对象为空；即使后续 DOM 更新，该对象也不会自动重查。
立即学习“前端免费学习笔记（深入）”；
- 必须用事件委托：
$(document).on("change", ".my-checkbox", handler)，或作用域更小的父容器（如$("#form").on("change", ".my-checkbox", ...)） - handler 中读取状态不能依赖初始化缓存的选择器，例如
$(".my-checkbox:checked")必须每次调用都实时查询，而非复用const $boxes = $(".my-checkbox")后再$boxes.filter(":checked") - 不要用箭头函数写 handler——
this会丢失对当前 checkbox 元素的引用，影响this.checked或this.value的获取
