onchange在blur或enter键（仅文本类input）且值改变时触发；值变更检测基于上次onchange后的快照，非初始值；type不支持、值未变、脚本赋值等均导致不触发。
onchange 事件触发的两个入口：blur 和 Enter 键
onchange 不是“只在失去焦点时触发”，它在两种用户主动提交行为下都会触发：一是元素 blur（鼠标点别处、Tab 切换等），二是 Enter 键按下（仅限 type="text"、type="search" 等可编辑文本框，type="number" 或 type="email" 也支持，但 type="checkbox" 或 type="radio" 不走 Enter 路径）。
关键前提是：**值必须发生改变**。如果用户输入后又删空、或输入相同内容再回车，onchange 不会触发。
- blur 触发：只要值变过，哪怕只输一个字母然后点页面其他地方，就触发
- Enter 触发：必须在输入框有焦点时按 Enter，且当前 value 与初始 value（或上次触发后的 value）不同才触发
- 两者都依赖「值变更检测」——它对比的是上一次
onchange触发后的值，不是页面加载时的初始值（除非从未触发过）
为什么有时候按 Enter 没反应？常见原因
看起来「按了 Enter 却没触发 onchange」，大概率不是事件本身失效，而是条件未满足：
- input 的
type不支持 Enter 提交，比如type="date"、type="file"、type="hidden"—— 它们没有 Enter 行为语义 - 用户在输入后又手动恢复原值（例如从
"abc"改成"abcd"再删掉"d"），最终 value 与上次onchange后一致，就不会再触发 - 脚本调用
input.value = "xxx"修改值，不会标记“用户变更”，因此后续 blur 或 Enter 都不触发onchange - 表单被
event.preventDefault()阻止了默认行为（虽然 Enter 本身不提交表单，但某些框架会拦截）
onchange 和 oninput 在 Enter 场景下的分工差异
如果你需要「一敲 Enter 就立刻响应」，onchange 是对的；但如果你要「每敲一个键都响应」，就得用 oninput。它们不是替代关系，而是职责分离：
-
onchange：适合做校验、保存、同步到 store 等「终态确认」操作，天然防抖（避免高频触发） -
oninput：适合实时搜索、字符计数、格式化（如加千分位），但它不会响应 Enter 键带来的额外语义，也不会响应浏览器自动填充、粘贴后失焦的场景（除非你监听input+blur组合） - 注意：
oninput在 IE9 及以下不支持，得 fallback 到onpropertychange（仅 IE）；而onchange全浏览器支持，无兼容性包袱
调试 onchange 是否触发的最简方法
别靠肉眼猜，直接加一行调试输出：
<input type="text" value="init" onchange="console.log('onchange fired:', this.value, 'timestamp:', Date.now())">
然后做这几件事观察日志：
- 输入
hello→ 点空白处 → 日志出现 - 接着输入
world→ 按 Enter → 日志再出现 - 再输入
hello（还原）→ 失去焦点 → 日志不出现（值未变） - 用 JS 执行
document.querySelector('input').value = 'test'→ 再 blur → 日志不出现（脚本赋值不触发onchange）
真正容易被忽略的是「值变更检测的基准点」——它不是 DOM 初始化值，而是每次 onchange 触发后内部记录的 snapshot。这个机制决定了你在复杂交互中可能漏掉预期触发。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
