jQuery事件

一丶概念

页面对不同访问者的响应叫做事件。
事件处理程序指的是当 HTML 中发生某些事件时所调用的方法。
实例:
在元素上移动鼠标
选取单选按钮
点击元素
1.什么是事件

二丶基本语法

$("选择器").事件名称();
1.事件语法
$("选择器").事件名称(function(){

动作出发后执行的代码

});
2.事件函数
$(docuent).ready(function(){

动作出发后执行的代码

该语句的作用在于等待文档完全加载后运行jQuery代码

});

简写为:$(function()){

});
3.完全文档事件函数

三丶事件方法

(1)事件绑定on()绑定事件 one()绑定事件(触发一次事件)
(2)移除绑定事件off()移除事件
语法:$("选择器").方法("事件方法",function(){
});
1.绑定或删除事件
(1)mousedown()鼠标到元素上,按下触发

(2)mouseup()鼠标到元素上,按下后松开触发

(3)mouseenter()鼠标移动到元素上触发(仅限当前元素)

(4)mouseleave()鼠标移动到元素上离开后触发(仅限当前元素)

(5)mousemove()鼠标在元素上移动时触发

(6)mouseout()鼠标移动到元素上离开后触发(包括当前元素和子元素)

(7)mousover()鼠标移动到元素上触发(包括当前元素和子元素)

(8)click单击元素时触发

(9)dblclick双击元素时触发

(10)hover()当鼠标悬停触发
2.鼠标事件
(1)keydown()键按下的过程中触发

(2)keypress()键被按下触发

(3)keyup()键松开触发
3.键盘事件
(1)submit()提交表单时触发

(2)change()元素值发生改变时触发

(3)focus()获得焦点触发

(4)blur()失去焦点触发
4.表单事件
(1)resize()调整浏览器窗口大小时触发

(2)scroll()滚动指定元素时触发

(3)select()input元素选择时触发
5.文档/窗口事件

四丶委托事件(类似于继承)

事件委托是通过事件冒泡的原理,利用父标签去捕获子标签的事件

$("table").on("click", ".delete", function () {
  // 删除按钮绑定的事件
})
委托事件示例

事件冒泡原理会逐级上递事件

猜你喜欢

转载自www.cnblogs.com/cangshuchirou/p/8921037.html