遏止checkbox的父元素事件冒泡

阻止checkbox的父元素事件冒泡

今天在开发后台权限管理时使用了tinyaccordion 这个小控件,如图所示

遏止checkbox的父元素事件冒泡

这个结构代码大致如下:

遏止checkbox的父元素事件冒泡

在过程中长时间纠结于,点击标注的checkbox也会触发其父元素H3的click事件,

起初对checkbox是监听其 change 事件,不管怎么搞,H3的click事件都会被触发,折腾了3个多小时,使用了各种方法都不行,几乎是把这个小控件完全自己实现了一遍都没有搞定这个问题,

 

哀莫大于心死,索性直接监听checkbox的click事件,代码如下:

$(':checkbox.chbox').click(function(evt){
    var is = $(this).attr('checked');
    var xid = $(this).attr('xid');
        
    if ( is )
    {
        $(':checkbox[xtype="' + xid + '"]').attr('checked','checked');
    }
    else
    {
        $(':checkbox[xtype="' + xid + '"]').removeAttr('checked');
    }
    // 阻止冒泡
    evt.stopPropagation();
});

 

这样一来无非多写一些代码,也不管它是否会触发checkbox的change事件,试过 直接返回false,但是这么一来根本就不会勾选,所以直接阻止冒泡吧...

 

此处标注下... 以后不会再犯这么低级的错误