一、事件处理 on() 绑定事件
on () 方法优势1：可以绑定多个事件，多个处理事件处理程序。
$("div").on({ // 可以绑定多个事件
mouseover: function(){ },
mouseout: function(){ },
click: function(){ }
});
// 如果事件处理程序相同
$("div").on("mouseover mouseout", function(){
$(this).toggleClass("current"); // 根据事件做添加，删除样式的操作
});
on()方法优势2：可以事件委派操作。事件委派的定义就是，把原来加给子元素身上的事件绑定在父元素身上，就是把事件委派给父元素。
$("ul").on("click","li",function(){ //on("事件"，"子元素"，"回调函数")
alert('hello');
});
on()方法优势3：可以给未来动态创建的元素绑定事件
$("ol").on("click","li",function(){
alert(11);
})
var li=$("<li>后来创建的内容</li>");
$("ol").append(li);
二、解绑事件 off()
off()方法可以移除用过on()方法添加的事件处理程序
$("p").off(); //解绑p元素所有事件处理程序
$("p").off("click"); //解绑p元素上面的点击事件
$("ul").off("click","li"); // 解绑事件委托
三、一次性事件one()
如果有的事件只想触发一次，可以使用one()来绑定事件。
$("p").one("click",function(){
alert(11); // 该程序只会允许用户点击一次
})
四、自动触发事件
1.元素.事件()
$("div").click(); // 会触发元素的默认行为
2.元素.trigger("事件");
$("div").trigger("click"); // 会触发元素的默认行为
3.元素.triggerHandler("事件"); //不会触发元素的默认行为
$("input").on("focus",function(){
$(this).val("你好吗");
});
$("input").triggerHandler("focus"); //不会触发光标聚焦的事件
五、事件对象
只要有事件的触发，就会有事件对象的产生：
element.on(evebts,[selector],function(event){}) //其中函数中的event就是事件对象
阻止默认行为：event.preventDefault()或者 return false
阻止冒泡：event.stopPropagation()
$(function(){
$(document).on("click",function(){
console.log("document的事件");
});
$("div").on("click",function(e){ //当点击了div会触发事件对象中的冒泡行为，会找到documnet，里面有点击事件，也会触发
console.log(event); //查看所有的对象，里面有很多属性和方法
console.log("div中的事件");
event.stopPropagation(); //阻止事件冒泡，这样document中的点击事件就不会触发。
})
})
