冒泡处理的含义？

如何获取表单里面输入的内容？

你们看focus和blur事件都绑到了div上，你点击input或者点完移开失去焦点当然没反应了，因为input没有绑定事件啊。
而focusin和focuout也绑在div上，为啥有反应呢？
因为后者在你点input的时候会一级一级的往上面查父元素，如果父元素有事件就执行了，所以你看到了效果。这叫事件冒泡。
为啥前者不行呢？因为前者不支持事件冒泡。

focus与blur事件：不支持冒泡，focusin与focusout支持冒泡

click与mousedown的区别：

click事件其实是由mousedown于mouseup 2个动作构成，所以点击的动作只有在松手后才触发

triggerHandler与trigger的用法是一样的，重点看不同之处：

triggerHandler不会触发浏览器的默认行为，.triggerHandler( "submit" )将不会调用表单上的.submit()

.trigger() 会影响所有与 jQuery 对象相匹配的元素，而 .triggerHandler() 仅影响第一个匹配到的元素

使用 .triggerHandler() 触发的事件，并不会在 DOM 树中向上冒泡。 如果它们不是由目标元素直接触发的，那么它就不会进行任何处理

与普通的方法返回 jQuery 对象(这样就能够使用链式用法)相反，.triggerHandler() 返回最后一个处理的事件的返回值。如果没有触发任何事件，会返回 undefined

$('#elem').trigger('click');

在绑定on的事件元素上，通过trigger方法就可以调用到alert了，挺简单！

再来看看.trigger是什么？

简单来讲就是：根据绑定到匹配元素的给定的事件类型执行所有的处理程序和行为

trigger除了能够触发浏览器事件，同时还支持自定义事件，并且自定义时间还支持传递参数

$('#elem').on('Aaron', function(event,arg1,arg2) {
    alert("自触自定义时间")
 });
$('#elem').trigger('Aaron',['参数1','参数2'])

event.which：获取在鼠标单击时，单击的是鼠标的哪个键

event.which 将 event.keyCode 和 event.charCode 标准化了。event.which也将正常化的按钮按下(mousedown 和 mouseupevents)，左键报告1，中间键报告2，右键报告3

event.currentTarget : 在事件冒泡过程中的当前DOM元素

冒泡前的当前触发事件的DOM对象, 等同于this.

event.pageX 和 event.pageY：获取鼠标当前相对于页面的坐标

通过这2个属性，可以确定元素在当前页面的坐标值，鼠标相对于文档的左边缘的位置（左边）与 （顶边）的距离，简单来说是从页面左上角开始,即是以页面为参考点,不随滑动条移动而变化

绑定2个事件

$("elem").on("mousedown mouseup",fn)

删除一个事件

$("elem").off("mousedown")

删除所有事件

$("elem").off("mousedown mouseup")

快捷方式删除所有事件，这里不需要传递事件名了，节点上绑定的所有事件讲全部销毁

$("elem").off()

.on( events ,[ selector ] ,[ data ], handler(eventObject) )

在on的第二参数中提供了一个selector选择器，简单的来描述下

参考下面3层结构

<div class="left">
   <p class="aaron">
       <a>目标节点</a> //点击在这个元素上
   </p>
</div>

给出如下代码：

$("div").on("click","p",fn)

事件绑定在最上层div元素上，当用户触发在a元素上，事件将往上冒泡，一直会冒泡在div元素上。如果提供了第二参数，那么事件在往上冒泡的过程中遇到了选择器匹配的元素，将会触发事件回调函数

基本用法：.on( events ,[ selector ] ,[ data ] )

最常见的给元素绑定一个点击事件，对比一下快捷方式与on方式的不同

$("#elem").click(function(){})  //快捷方式
$("#elem").on('click',function(){}) //on方式

最大的不同点就是on是可以自定义事件名，当然不仅仅只是如何，继续往下看

多个事件绑定同一个函数

$("#elem").on("mouseover mouseout",function(){ });

通过空格分离，传递不同的事件名，可以同时绑定多个事件

多个事件绑定不同函数

$("#elem").on({
   mouseover:function(){},  
   mouseout:function(){}
});

通过空格分离，传递不同的事件名，可以同时绑定多个事件，每一个事件执行自己的回调方法

focus()在元素本身产生，focusin()在元素包含的元素中产生

blur与focusout也亦是如此

当一个元素，或者其内部任何一个元素失去焦点的时候，比如input元素，用户在点击失去焦的时候，如果开发者需要捕获这个动作，jQuery提供了一个focusout事件

当一个元素，或者其内部任何一个元素获得焦点的时候，例如：input元素，用户在点击聚焦的时候，如果开发者需要捕获这个动作的时候，jQuery提供了一个focusin事件

$(selector).hover(handlerIn, handlerOut)

handlerIn(eventObject)：当鼠标指针进入元素时触发执行的事件函数

handlerOut(eventObject)：当鼠标指针离开元素时触发执行的事件函数