on() 方法在被选元素及子元素上添加一个或多个事件处理程序。
如需移除事件处理程序，请使用 off() 方法。
如需添加只运行一次的事件然后移除，请使用 one() 方法。
语法：
.on( events [, selector ] [, data ], handler(eventObject) )
events：类型: String（必选）
- 一个或多个空格分隔的事件类型和可选的命名空间，或仅仅是命名空间，比如"click", "keydown.myPlugin", 或者 ".myPlugin"。
selector：类型: String（可选）
- 一个选择器字符串，用于过滤出被选中的元素中能触发事件的后代元素。如果选择器是 null 或者忽略了该选择器，那么被选中的元素总是能触发事件。
data：类型: Anything（可选）
- 当一个事件被触发时，要传递给事件处理函数的event.data。
handler(eventObject)：类型: Function() （必选）
- 事件被触发时，执行的函数。若该函数只是要执行return false的话，那么该参数位置可以直接简写成 false。
嗯，这个我们用的其实也还蛮多的，所以events和fn我就不详细说了，主要是data参数和selector参数说一下
function可以是false，嗯，看个例子：
取消表单的提交动作，并且通过返回 false 的方法来防止事件冒泡：
$("form").on("submit", false)如果data参数给.on()并且不是null 或者 undefined，那么每次触发事件时，event.data都传递给处理程序。data参数可以是任何类型，但如果是字符串类型时，那么selector参数必须提供，或明确地传递null，这样的 data 参数不会误认为是选择器。最好是使用一个对象（键值对） ，所以可以作为属性传递多个值。
看个小例子
$('.div1').on('click',{name:"leo"},function(ev){
console.log(ev.data.name);//leo
});如果省略selector或者是null，那么事件处理程序被称为直接事件 或者 直接绑定事件 。每次选中的元素触发事件时，就会执行处理程序，不管它直接绑定在元素上，还是从后代（内部）元素冒泡到该元素的
当提供selector参数时，事件处理程序是指为委派 事件（注：通常也有很多人叫它代理事件）。事件不会在直接绑定的元素上触发，但当selector参数选择器匹配到后代（内部元素）的时候，事件处理函数才会被触发。jQuery 会从 event target 开始向上层元素(例如，由最内层元素到最外层元素)开始冒泡，并且在传播路径上所有绑定了相同事件的元素若满足匹配的选择器，那么这些元素上的事件也会被触发。
事件处理只能绑定在当前被选中的元素上;而且，在您的代码调用.on()的时候，他们必须在页面文档中已经存在。为了确保目前的元素可以被选择的
使用事件委托的好处：
委托事件有一个优势，他们能在后代元素添加到文档后，可以处理这些事件。 在确保所选择的元素已经存在的情况下，进行事件绑定时，您可以使用委派的事件，以避免频繁的绑定事件及解除绑定事件。
除了可以给未创建的后代元素绑定事件外（即上面提到的优势），代理事件的另一个好处就是，当需要监视很多元素的时候，代理事件的开销更小。
看个例子：
<!DOCTYPE html>
<html>
<head>
<style>
p { background:yellow; font-weight:bold; cursor:pointer;
padding:5px; }
p.over { background: #ccc; }
span { color:red; }
</style>
<script src="https://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<p>Click me!</p>
<span></span>
<script>
var count = 0;
$("body").on("click", "p", function(){
$(this).after("<p>Another paragraph! "+(++count)+"</p>");
});
</script>
</body>
</html>
点击任何一个段落时，就在它后面追加一个段落。注意，.on() 会为任何段落添加事件，包括新生成的段落，因为当事件冒泡到已经存在的 body 元素上时，就会触发绑定的事件
$("body").on("click", "a", function(event){
event.preventDefault();
});使用 preventDefault 方法，取消链接的默认动作。
参考文章：https://www.jquery123.com/on/
标签：jQuery,触发,绑定,元素,介绍,selector,事件,详细,data From： https://blog.51cto.com/u_15983333/6091813