jQuery 教程 jQuery 教程jQuery 下载 jQuery 语法jQuery 选择器jQuery 事件jQuery 效果 jQuery 显示和隐藏jQuery 参考手册 键盘码(KeyCode)对照表

jQuery 事件

事件是浏览器或用户在页面上发生的交互动作,比如点击、鼠标移动、键盘输入等。事件通常由浏览器触发,也可以由用户的交互引起,在 JavaScript 中,可以使用事件监听器(event listener)捕捉和响应特定的事件。事件是方法的一部分。

事件大全
事件分类事件名称事件描述
鼠标事件

click鼠标单击触发

dblclick鼠标双击触发

mouseenter鼠标指针进入元素触发

mouseleave鼠标指针离开事件触发

hover鼠标进入和鼠标移开这两种交互动作触发

mouseover鼠标进入元素或子元素时触发

mouseout鼠标指针离开元素或子元素触发

mousemove鼠标移动事件触发

mouseup鼠标按键释触发

mousedown鼠标按下触发

event.which监视是哪个键触发键盘和鼠标事件

event.pageY鼠标相对于页面的垂直坐标

event.pageX鼠标相对于页面的水平坐标

contextmenu鼠标右键时触发的上下文菜单事件方法
键盘事件

keypress键盘按下事件

keydown捕获键盘按键按下事件

keyup键盘按键释放事件

event.which监视是哪个键触发键盘和鼠标事件
表单事件

submit处理表单提交事件

change元素值发生改变时触发的事件方法

focus元素得到焦点触发事件

focusin元素得到焦点(包含子元素)触发

focusout元素(包含子元素)失去焦点触发

blur元素失去焦点时触发

select捕获输入框中选择文本事件
文档/窗口事件

load元素加载完成事件

resize捕获浏览器窗口大小改变事件

scroll捕获元素滚动事件

ready文档加载后执行的代码事件

holdReady暂停或恢复被请求的ready事件
其他事件

on绑定事件

trigger手动触发已绑定事件

triggerHandler手动触发已绑定事件(不触发默认行为)

bind绑定事件(使用on事件代替)

delegate绑定事件(使用on事件代替)

live绑定事件(使用on事件代替)

off移除元素绑定事件

unbind移除元素绑定事件(使用off事件代替)

undelegate移除元素绑定事件(使用off事件代替)

die移除元素绑定事件(使用off事件代替)

error处理JavaScript错误方法

proxy向上下文对象元素添加事件

one为元素注册每一个事件处理程序事件

event.currentTarget当前事件的DOM元素

event.data数据对象传递给事件

event.delegateTarget事件委托中目标元素的信息

event.target触发事件的DOM元素

event.isDefaultPrevented判断是否已阻止默认行为

event.preventDefault阻止事件的默认行为

event.stopImmediatePropagation阻止剩余的事件处理函数

event.isImmediatePropagationStopped

是否调用过阻止剩余的事件处理函数方法

event.stopPropagation防止事件冒泡

event.isPropagationStopped判断是否调用过event.stopPropagation方法

event.metaKey事件触发时Meta键是否按下

event.namespace给事件添加命名空间

event.relatedTarge上一个元素或父元素目标

event.result获取自定义事件前一个返回值

event.timeStamp返回事件触发的毫秒数

event.type事件的具体类型

实例

事件方法会触发匹配元素的事件,或将函数绑定到所有匹配元素的某个事件。

触发实例:

$("#myButton").click()

 <button id="myButton">点击我</button>
    <script>
      $(document).ready(function() {
        $("#myButton").click(function() {
          alert("你点击了按钮!");
        });
      });
    </script>

上面的例子将触发 id="myButton" 的 button 元素的 click 事件。

运行代码

绑定实例:

下面案例在页面加载后执行指定代码

<script> 
    $(document).ready(function() {
      // 这里添加在页面加载完成后要执行的代码
      alert("页面加载完成");
    });
  </script>

运行代码