阻止浏览器默认的事件冒泡行为

 事实上stoppropagation和cancelBubble的作用是一样的,都是用来阻止浏览器默认的事件冒泡行为。

不同之处在于stoppropagation属于W3C标准,试用于Firefox等浏览器,但是不支持IE浏览器。相反cancelBubble不符合W3C标准,而且只支持IE浏览器。所以很多时候,我们都要结合起来用。不过,cancelBubble在新版本chrome,opera浏览器中已经支持。

语法:e.stopPropagation();

参数e:表示事件传递的参数,代表事件的状态。

http://www.365mini.com/page/jquery-event-stoppropagation.htm

/*左侧导航栏出现和消失*/
    $(".show-list").unbind("click").click(function(){if(window.event) event.cancelBubble = true;
        else event.stopPropagation();
        $(".cr-sider-bar").show();        
    });
    /*点击屏幕任何部位弹出框消失*/
    $(document).click(function(){
        $(".cr-sider-bar").hide();
        $(".crbox-opra").hide();
    })
    

实现:点击show-list时,出现左侧导航栏,点击屏幕任意地方,左侧导航栏消失

posted @ 2017-08-19 15:03  boyanh  阅读(621)  评论(0编辑  收藏  举报