jQuery的$(document).on()方法详解和示例

jQuery的$(document).on()方法

jQuery的$(document).on()方法是jQuery中的事件绑定方法，它可以将一个函数绑定到指定的元素上，当指定的元素触发指定的事件时，这个函数就会被触发执行。

$(document).on()方法支持两种语法：

$(document).on(events,selector,data,handler);

$(document).on(events,selector,handler);

其中events参数表示要绑定的事件，可以是多个事件，用空格分隔；selector参数表示要绑定的元素；data参数表示传递给handler函数的参数；handler参数表示要绑定的函数。

示例

下面的示例演示了如何使用$(document).on()方法绑定一个函数到文档中的所有按钮上：

$(document).on('click','button',function(){
    alert('按钮被点击了！');
});

上面的代码将一个函数绑定到文档中所有按钮上，当按钮被点击时，就会弹出一个提示框。

$(document).on()方法还可以绑定给动态添加的元素，例如：

$(document).on('click','.myButton',function(){
    alert('按钮被点击了！');
});
$('#container').append('按钮');

上面的代码将一个函数绑定到文档中所有带有myButton类的按钮上，由于这个按钮是动态添加的，所以$(document).on()方法可以自动绑定到这个按钮上，当按钮被点击时，就会弹出一个提示框。

$(document).on()方法是jQuery中一个非常有用的事件绑定方法，它可以将一个函数绑定到指定的元素上，当指定的元素触发指定的事件时，这个函数就会被触发执行，而且它还可以绑定给动态添加的元素，使用起来非常方便。

千锋教育是高品质web前端培训机构，千锋教育拥有大量实力web前端培训讲师，提供优质的web培训课程，web前端培训，欢迎报名千锋教育。