on()函数使用

在初学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: 事件处理函数

原文地址:https://www.cnblogs.com/cherishSmile/p/8359490.html