1、jquery事件绑定和委托的实现

jQuery的事件绑定和委托可以使用 on()、one()、bind()、live()、delegate()等方法实现。

1、on() ：

语法：$(selector).on(event,childSelector,data,function)

作用：可以在被选元素及子元素上添加一个或多个事件处理程序，并且此事件处理程序适用于当前及未来的元素。

一般使用：

$("#thisA").on("click", function(){

console.log("id是thisA的标签添加了click点击事件。");

});

或：

$("#thisA").on("click mouseover",{id:"id"}, function(e){

console.log("id是thisA的标签添加了点击和鼠标悬停事件，传递的值是："+e.data.id);

});

或：

$("body").on("click","#thisA" ,function(){

console.log("可以给当前元素下的子元素添加事件");

});

可用off()方法移除事件绑定：

$("#thisA").off("click");

如需添加只运行一次的事件然后移除，可直接使用 one() 。

2、bind()：

语法：$(selector).bind(event,data,function,map)

作用：向被选元素添加一个或多个事件处理程序，以及当事件发生时运行的函数，不能为未来元素添加事件。

一般使用：

$("#thisA").bind("click", function(){

console.log("id是thisA的标签添加了click点击事件。");

});

或：

$("button").bind({

click:function(){$("p").slideToggle();},

mouseover:function(){$("body").css("background-color","#E9E9E4");},

mouseout:function(){$("body").css("background-color","#FFFFFF");}

});

可用unbind()方法移除事件绑定。

3、live() ：

此方法在 jQuery 版本 1.7 中废弃，在版本 1.9 中被移除。请使用 on() 方法代替。

4、delegate()：

语法：$(selector).delegate(childSelector,event,data,function)

用法：为指定的元素及其子元素添加一个或多个事件处理程序，此方法适用于当前或未来的元素。

一般使用：使用实例类似于on（）。

可用undelegate()方法移除事件绑定。

总结：jQuery的事件绑定和委托基本可以使用清一色的on方法进行实现，特殊情况另外考虑。（一家之言，可能有误）

1、jquery事件绑定和委托的实现相关推荐

JQuery事件绑定，bind与on区别
jquery事件绑定 bind:向匹配元素添加一个或多个事件处理器 $(selector).bind("click",data,function); live:向当前或未来的匹配元 ...
JQuery-学习笔记06【高级——JQuery事件绑定和切换】
Java后端学习路线笔记汇总表[黑马程序员] JQuery-学习笔记01[基础--JQuery基础]--[day01] JQuery-学习笔记02[基础--JQuery选择器] JQuery-学习 ...
jquery事件绑定和解除绑定bind、unbind、one
全栈工程师开发手册 (作者:栾鹏) jquery系列教程4-事件操作全解 jquery事件绑定使用函数bind(type [,data],fn)绑定事件,one函数也可以进行一次绑定,但是需要注意b ...
day05【JQuery框架】HTML引入Jquery、jQuery与JS区别、基本选择器、层级关系选择器、属性选择器、过滤选择器、对象遍历、Jquery的DOM操作【重点】、Jquery事件绑定
回顾 1. bom对象window对象三种弹框alert()confirm()prompt()二种定时器一次性:setTimout() --- 通过递归实现循环性循环性:setInterval()lo ...
HTML中详述jQuery事件绑定方式
jQuery事件绑定方式 1.bind()方法: bind(type,[data],fn):为每个匹配元素的特定事件绑定对应的事件处理函数,各参数含义如下: type表示事件类型,多个事件类型使用空格 ...
js事件委托和jQuery事件绑定on , off , one , bind , unbind , die
一. 事件委托什么是事件委托?用现实中的理解就是:有100 个学生同时在某天中午收到快递,但这 100 个学生不可能同时站在学校门口等,那么都会委托门卫去收取,然后再逐个交给学生. 而在jQuery ...
jquery事件绑定与事件委托
//事件绑定简写形式$(".div2 button").click(function () {$(".div1").scrollTop(0)})//写全了方式$ ...
jQuery事件绑定on()、bind()与delegate() 方法详解
啃了一段日子的js相关了,学的过程中发现在jQuery中绑定事件时,有人用bind(),有人用on(),有人用delegate(),还有人用live(),看代码的时候觉得都实现功能了也就掀过去了,只是 ...
【源码小记】jQueryの事件绑定
前言这篇笔记很大的帮助来源于慕课网上jQuery源码解读课程,虽然jQuery现在已经慢慢衰退了,但是作为一个学习者,我自己还是很愿意去琢磨琢磨其中的原理.如果有错误欢迎指出,谢谢了^0^. 事件绑 ...

1、jquery事件绑定和委托的实现

1、jquery事件绑定和委托的实现相关推荐

最新文章

热门文章