在初学jquery时,就已经掌握了on()函数的基本用法,用来给DOM元素绑定事件,但是如何在绑定事件的同时向事件处理函数传递参数呢?这就需要了解on()函数的一些细节用法:
on()函数的两种使用方法:
用法一:jQueryObject.on( events [, selector ] [, data ], handler )
用法二:jQueryObject.on( eventsMap [, selector ] [, data ] )
参数说明:
events: String类型,事件名称,如 click,focus等
eventsMap: Object对象,其每个属性对应事件类型和可选的命名空间(参数events),属性值对应绑定的事件处理函数(参数handler),如下:
var data = { id: 5, name: "张三" };
var events = {
"mouseenter": function(event){
$(this).html( "你好," + event.data.name + "!");
},
"mouseleave": function(event){
$(this).html( "再见!");
}
};
//为n5绑定mouseenter mouseleave两个事件,并为其传入附加数据data
$("body").on(events, "#n5", data);
selector: jQuery选择器,相当于事件委托给后代元素
data: 一般为JSON,用于返回绑定当前事件处理函数时传递的附加数据,在函数里取传过来的值时,写法为 event.data.name
handler: 事件处理函数