jQuery中阻止事件冒泡方式及其区别

Jquery提供了两种方式来阻止事件冒泡
方式一：event.stopPropagation();
$("#div1").mousedown(function(e){
        e.stopPropagation();
});
方式二：return false;
$("#div1").mousedown(function(e){
        return false;
});

但是这两种方法是有区别的。
return false不仅阻止了事件往上冒泡，而且阻止了事件本身。
e.stopProoagation()则只阻止事件往上冒泡，不阻止事件本身。


js的写法：
1>.停止冒泡的写法
//如果提供了事件对象，则这是一个非IE浏览器
if(e&&e.stopPropagation){
        //因此它支持W3C的stopPropagation()方法
        e.stopPropagation();
}else{
        //否则，我们需要使用IE的方式来取消事件冒泡
        window.event.cancelBubble=ture;
}
return false;

2>.阻止浏览器的默认行为
//如果提供了事件对象，则这是一个非IE浏览器
if(e&&e.preventDefault){
        //阻止默认浏览器动作（W3C）
        e.preventDefault();
}else

jquery的写法：
A.return false---在事件的处理中，可以阻止默认事件和冒泡事件
B.event.preventDefault()---在事件的处理中，可以阻止默认事件但是允许冒泡事件的发生。
C.event.stopPropagation()---在事件的处理中，可以阻止冒泡但是允许默认事件的发生。

prototype的写法：
Event.stop(event)

用法介绍：
事件发生后，浏览器通常首先触发事件发生元素上的事件处理程序，然后是它的父元素，父元素的父元素……依此类推，直到文档的根元素为止。这被称为是事件冒泡，是事件传播的最常见的方式。当处理好一个事件后，你可能想要停止事件的传播，不希望它继续冒泡。
当你的程序有机会处理事件时，如果这个事件有默认行为，同时浏览器也会处理它。例如，点击导航链接，将表单提交到服务器，在一个单行文本框中按下回车键等等。如果对这些事件你定义了自己的处理方式，可能会非常希望阻止相关默认行为。

事件捕获：
允许多个元素响应单击事件的一种策略叫做事件捕获。在事件捕获的过程中，事件首先会交给最外层的元素，接着再交给更具体的元素。
事件目标：纯javascript属性event.target
事件处理程序的变量event保存着事件对象。而event.target属性保存折发生事件的目标元素。这个属性DOM API中规定的，但是没有被所有浏览器实现。Jquery通过.target可以确定DOM中首先接收到事件的元素（即被实际单击的元素），而且，this应用的是处理事件的DOM元素。
$(document).ready(function(){
        $("sweitcher").click(function(event){
                if(event.target==this){
                        $("#switcher .button").toggleClass('hidden');
                }
        });
});
target事件属性
定义和用法：target事件属性可返回事件的目标结点（触发该事件的结点），如生成事件的元素，文档或窗口。
语法：
event.target

事件委托：
通俗的讲，事件就是onclick，onmouseover等就是事件，委托就是让别人来做，这个事件本来是加在某些元素上的，然而却加到别人身上来做，完成这个事件。
原理：利用冒泡的原理，把事件加到父级上，触发执行效果。
作用：
1.性能好
2.针对新创建的元素，直接可以拥有事件
事件源：
跟this作用一样（他不用看指向问题，谁操作的就是谁），event对象下的
使用情景：
1.为DOM中的很多元素绑定相同事件。
2.为DOM中尚不存在的元素绑定事件。
Jquery的事件委托
$(function(){
        $('#ul1,#ul2').on('click',function(){
                if(!$(this).attr('s')){
                        $(this).css('background','red');
                        $(this).attr('s',true);
                }else{
                        $(this).css('background','#fff');
                        $(this).removeAttr('s');
                }
        });
});
事件切换
hover(over,out)
一个模仿悬停事件的方法。
over：鼠标移到元素上要触发的函数
out：鼠标移出元素要触发的函数
toggle(fn,fn)
每次点击后，依次触发函数
如果点击了一个匹配的元素后，则执行指定的第一个事件处理函数；
当再次点击该元素时，会执行下一个事件处理函数；
如果有更多函数，则依次触发，直到最后一个，然后循环调用。

jquery事件对象
jquery同意了事件对象，当绑定事件处理函数时，会将jquery格式化后的事件对象作为唯一参数传入：
$("#div1").bind("click",{foo:"ooo"},function(e){
        alert(e.data.foo);
});
jquery事件对象的函数：
preventDefault();
isDefaultPrevented();
stopPropagation();
isPropagationStopped();
stopImmediatePropagation();
isImmediatePropagationStopped();