前端开发：JS中常用事件汇总

在JavaScript中，常见的事件类型包括：

1. 鼠标事件：

   • click：用户点击元素
   • dblclick：用户双击元素
   • mousedown：用户按下鼠标按钮
   • mouseup：用户释放鼠标按钮
   • mousemove：用户移动鼠标
   • mouseenter：鼠标进入元素
   • mouseleave：鼠标离开元素
   • mouseover：鼠标经过元素
   • mouseout：鼠标离开元素
   • contextmenu：用户打开上下文菜单（例如点击鼠标右键）

2. 键盘事件：

   • keydown：用户按下键
   • keyup：用户释放键
   • keypress：用户按下并释放键（仅在按键产生字符时触发）

3. 表单事件：

   • input：用户在<input>或<textarea>元素中输入文本
   • change：表单元素的内容改变，通常用于<input>, <select>, 或 <textarea>
   • submit：用户提交表单
   • reset：用户重置表单

4. 窗口事件：

   • load：页面加载完毕
   • unload：用户离开页面
   • resize：窗口尺寸改变
   • scroll：滚动窗口
   • error：加载文档或图片时发生错误

5. 其他事件：

   • focus：元素获得焦点
   • blur：元素失去焦点
   • scrollstart：滚动开始（移动设备专用）
   • scrollend：滚动结束（移动设备专用）

举例使用：

// 为按钮添加点击事件
document.getElementById('myButton').addEventListener('click', function() {
    alert('按钮被点击了！');
});
 
// 监听文本输入框的内容改变
document.getElementById('myInput').addEventListener('input', function() {
    console.log('输入内容：', this.value);
});
 
// 窗口大小改变时的处理
window.addEventListener('resize', function() {
    console.log('窗口宽度：', window.innerWidth);
    console.log('窗口高度：', window.innerHeight);
});

这些事件可以通过addEventListener方法添加到HTML元素上。