在 HTML 中,<input> 元素支持的事件汇总

·
2025-12-21 13:28:31

在 HTML 中, 元素支持多种事件,这些事件可以在用户与输入字段交互时触发。以下是一些常见的 事件:

input:

元素的值发生变化时触发。适用于文本、数字、日期等类型的输入。

change:

元素的值发生变化并且失去焦点(blur)时触发。适用于文本、复选框、单选按钮等。

focus:

元素获得焦点时触发。例如,当用户点击或使用 Tab 键导航到输入字段时。

blur:

元素失去焦点时触发。例如,当用户点击页面的其他地方或按 Tab 键离开输入字段时。

keydown:

当用户按下键盘上的任意键时触发。可以用于捕获特定的按键操作。

keyup:

当用户释放键盘上的任意键时触发。通常用于检测按键释放后的状态。

keypress:

当用户按下并释放一个字符键时触发。注意:这个事件在现代浏览器中已经被 beforeinput 和 input 事件所取代。

click:

当用户点击 元素时触发。对于按钮和复选框特别有用。

mousedown:

当用户按下鼠标按钮时触发。适用于需要捕获鼠标按下动作的情况。

mouseup:

当用户释放鼠标按钮时触发。适用于需要捕获鼠标释放动作的情况。

select:

当用户选择 元素中的文本时触发。适用于文本输入字段。

paste:

当用户粘贴内容到 元素中时触发。可以用于处理粘贴的内容。

cut:

当用户剪切 元素中的内容时触发。可以用于处理剪切的内容。

copy:

当用户复制 元素中的内容时触发。可以用于处理复制的内容。

示例代码

以下是一个示例,展示了如何在 元素上绑定和处理一些常见的事件:

Input Events Example

在这个示例中,我们为 元素绑定了多个事件处理器,并在控制台中输出相关信息。你可以根据需要添加更多的事件处理逻辑。