监听 input 事件即可捕获 search 输入框清空按钮操作，无需额外监听点击；change 事件不触发，因清空是即时行为且焦点未离开；可通过比对当前值为空而上次值非空来识别清空动作。
在 search 类型的输入框中，浏览器会自动提供一个清空按钮（×），点击它时会清空值并触发 input 事件，但不会触发 change 事件。你无需额外监听“清空按钮点击”，因为它的行为已封装在标准 input 事件流中——只要监听 input，就能捕获手动输入、粘贴、以及点击清空按钮导致的值变化。
确保监听的是 input 事件，不是 change
change 事件只在元素失去焦点且值发生改变时触发，而清空按钮操作是即时生效的，且焦点通常仍在输入框内，所以 change 不会被触发。必须用：
element.addEventListener('input', handler)- 或内联写法：
<input type="search" oninput="handleInput()">
区分清空操作和其他输入（可选）
如果你需要专门识别“用户点了清空按钮”（比如做埋点或特殊逻辑），可以结合 input 事件 + beforeinput（实验性，兼容性有限）或更稳妥的“值变为空 + 上次非空”的判断方式：
- 缓存上一次的值（例如用
data-last-value属性或闭包变量） - 在
input回调中检查：当前值为空 && 上次值不为空 → 很可能是清空按钮触发 - 示例逻辑：if (input.value === '' && lastValue !== '') { /* 清空动作 */ } lastValue = input.value;
注意 type="search" 的默认行为
该类型输入框在 Safari、Chrome 等浏览器中自带清空按钮，但它的点击不派发独立事件（如 click 到 × 图标上），也不冒泡到 input 元素外。因此不要尝试监听 click 或 mousedown 在 × 上——它不可访问。唯一可靠入口仍是 input 事件。
立即学习“Java免费学习笔记（深入）”；
兼容性与 polyfill 提示
所有现代浏览器均支持 input 事件对 search 清空的响应。IE10+ 也支持。若需支持极老环境（如 IE9），可降级监听 propertychange（仅 IE），但一般无需考虑。
