一、绑定事件

on()、one（）、hover（）、常用事件函数

on()：

1、基础绑定事件
语法：元素集合.on('事件类型'，事件处理函数)
$('div').on('click',function(){})2、元素委托绑定事件
语法：元素集合.on('事件类型'，选择器，事件处理函数)
事件委托，把p元素的事件委托给div，把事件绑定给div元素，当你在div内的p标签触发事件时，执行事件处理函数
$('div').on('click','p',function(){})3、批量绑定事件
语法：元素集合.on({事件类型1:处理函数，事件类型2:处理函数})
注意：不能进行事件委托了
$('div').on({click:function(){}mouseover: function(){}mouseout:function(){}
})

one():

只执行一次，语法和on()一样

1、基础绑定事件
语法：元素集合.one('事件类型'，事件处理函数)
$('div').one('click',function(){})2、元素委托绑定事件
语法：元素集合.one('事件类型'，选择器，事件处理函数)
事件委托，把p元素的事件委托给div，把事件绑定给div元素，当你在div内的p标签触发事件时，执行事件处理函数
$('div').one('click','p',function(){})3、批量绑定事件
语法：元素集合.one({事件类型1:处理函数，事件类型2:处理函数})
注意：不能进行事件委托了
$('div').one({click:function(){}mouseover: function(){}mouseout:function(){}
})

hover

鼠标移入移出触发
不能做事件委托

元素集合.hover(移入时触发的函数，移出时触发的函数)
当你只传递一个函数的时候，移入移除都会触发例如：
$('div').hover(
function(){},
function(){}
)

常用事件函数：

click()
mouseover()
mouseout()
change()$('div').click(function(){})

二、解绑和触发

off()事件解绑和 trigger()事件触发

举个例子：

//准备事件处理函数
function handleA(){}
function handleB(){}
function handleC(){}//给div元素绑定事件
$('div')
.click(handleA)
.click(handleB)
.click(handleC)

off()事件解绑

解绑全部事件处理函数
$('div').off('click')
解绑指定事件处理函数
$('div').off('click',handleA)

trigger()事件触发，使用代码方式来触发事件

$('div').trigger('click')

03-jQuery事件绑定和解绑相关推荐

jQuery事件绑定和解绑
jQuert事件 1.1. jQuery 事件注册 jQuery 为我们提供了方便的事件注册机制,是开发人员抑郁操作优缺点如下: 优点: 操作简单,且不用担心事件覆盖等问题. 缺点: 普通的事件注 ...
11-jQuery的事件绑定和解绑
[转]11-jQuery的事件绑定和解绑 1.绑定事件语法: bind(type,data,fn) 描述:为每一个匹配元素的特定事件(像click)绑定一个事件处理器函数. 参数解释: type ( ...
jQuery的事件绑定和解绑
1.绑定事件语法: bind(type,data,fn) 描述:为每一个匹配元素的特定事件(像click)绑定一个事件处理器函数. 参数解释: type (String) : 事件类型 data ( ...
jquery事件绑定解绑机制源码分析
引子为什么Jquery能实现不传回调函数也能解绑事件?如下: $("p").on("click",function(){alert("The par ...
JQuery事件绑定解绑方法小结
常用的方法绑定:bind().delegate().on() 解绑:unbind().undelegate().off() 此外还有live() 不过JQuery1.9及其以上版本删除了此方法推荐 ...
Vue-组件自定义事件(绑定和解绑)
组件自定义事件(绑定) 像click,change这些都是js的内置事件,我们可以直接使用,本次我们学习自己根据需求打造全新的事件,但是js内置的是给html元素用的,本次的自定义事件是给组件用的注 ...
JS事件的绑定和解绑
/* 事件三要素 1.事件源:在谁的身上绑定事件 2.事件类型:什么事件 3.事件处理函数:当行为发生的时候,执行那一个函数 ==>div.οnclick=function(){} ==> ...
JS中事件的绑定和解绑
JS中事件的绑定和解绑一. 了解事件 1. 事件的三要素 2. 事件绑定分类 2-1. dem0级事件 2-2. dom2级事件二. 事件的绑定 1. dom0级事件 2. dom2级事件 ...
JQuery-学习笔记06【高级——JQuery事件绑定和切换】
Java后端学习路线笔记汇总表[黑马程序员] JQuery-学习笔记01[基础--JQuery基础]--[day01] JQuery-学习笔记02[基础--JQuery选择器] JQuery-学习 ...

03-jQuery事件绑定和解绑

文章目录

一、绑定事件

二、解绑和触发

03-jQuery事件绑定和解绑相关推荐

最新文章

热门文章