<p>oninput 和 onchange 是输入交互的阈值分界线：oninput 实时触发，适合搜索过滤；onchange 失焦或选项变更后触发，适合表单校验；data- 属性需 JS 主动读取并判断，非自动生效。</p>
直接用 HTML 属性控制交互“什么时候触发”，关键不在属性本身，而在于它和 JavaScript 的配合方式——data- 属性不带阈值逻辑，oninput 和 onchange 的触发时机差异才是真正的执行阈值开关。
oninput vs onchange：输入类交互的天然阈值分界线
用户每敲一个键，oninput 就立刻触发；而 onchange 要等到元素失去焦点（blur）或选项真正变更后才执行。这不是 bug，是浏览器定义的语义差异。
- 搜索框实时过滤、字符计数、格式预览 → 用
oninput，但记得加防抖，否则高频触发会卡顿 - 表单提交校验、下拉菜单选中后加载数据 → 用
onchange，避免中间态干扰 -
onchange对<input type="checkbox">是点击即触发，对<input type="text">却要 blur 才触发——这点容易误判，务必按类型区分
data-threshold 这类自定义属性不会自动生效
写 data-threshold="3" 不会让元素在第三次点击时才响应。它只是个静态容器，必须由 JS 主动读取并做判断。
- 正确做法：
element.addEventListener('click', () => { if (Number(element.dataset.threshold) - 数值型
dataset值始终是字符串，"3" > "10"会返回true，必须用Number()或一元加号+element.dataset.threshold转换 - 布尔型别写
data-active，要写data-active="true"，否则dataset.active返回空字符串，if (el.dataset.active)判定为 false
enterkeyhint + onkeydown 组合可手动定义“回车键”阈值
enterkeyhint="search" 只改软键盘回车文案，不改变行为；真正控制“按回车是否触发搜索”，得靠 onkeydown 拦截 Enter 键码，并结合输入长度等条件做判断。
立即学习“前端免费学习笔记（深入）”；
- 常见漏判：
event.key === 'Enter'在部分安卓 WebView 中可能失效，更稳妥的是event.code === 'Enter'或检查event.keyCode === 13 - 移动端软键盘收起后，
blur事件可能延迟触发，若依赖onchange+blur做阈值校验，会出现“已回车但未执行”的感知断层 - 若需“至少输 2 个字才允许回车提交”，逻辑必须放在
onkeydown里，而不是等onsubmit再拦——后者用户已经看到页面跳转或刷新了
阈值不是写在 HTML 里的 magic number，而是 JS 读取配置后做的显式判断；最容易被忽略的是字符串数字比较、移动端 blur 延迟、以及 onchange 在不同表单控件上的不一致行为。
