jquery on
jQuery on() 方法
on() 是 jQuery 中用于事件绑定的核心方法，支持动态元素事件委托和多种事件类型绑定。
基本语法
$(selector).on(event, childSelector, data, handler);- event：事件类型（如
"click"、"mouseenter"）。 - childSelector（可选）：子选择器，用于事件委托。
- data（可选）：传递给事件处理函数的额外数据。
- handler：事件触发时执行的函数。
直接绑定事件
为现有元素绑定点击事件：
$("#button").on("click", function() {
alert("Button clicked!");
});事件委托
通过父元素为动态添加的子元素绑定事件：
$("#parent").on("click", ".child", function() {
console.log("Child element clicked");
});多事件绑定
同时绑定多个事件类型：
$("#element").on({
mouseenter: function() {
$(this).css("background", "yellow");
},
mouseleave: function() {
$(this).css("background", "white");
}
});传递额外数据
向事件处理函数传递自定义数据：
$("#element").on("click", { name: "John" }, function(event) {
console.log("Data: " + event.data.name); // 输出 "Data: John"
});移除事件
使用 off() 解除绑定：
$("#button").off("click");注意事项
- 事件委托需确保父元素在绑定时已存在。
- 过度使用事件委托可能影响性能，建议仅在需要动态元素时使用。
- jQuery 3.0+ 推荐使用
on()替代旧的bind()、delegate()等方法。
通过灵活使用 on()，可以实现高效且可维护的事件管理。
