JS - 点击事件排除父级标签

点击事件排除父级标签，这里使用的是stopPropagation()方法。event.stopPropagation();

对了，这里还用了解除click事件，unbind。

下面这篇博文，介绍挺全的

http://www.cnblogs.com/zhangq723/archive/2011/04/02/2003358.html

把文章拷贝了一下，在这个折叠中。

移除事件

    unbind(type [,data])     //data是要移除的函数

    $('#btn').unbind("click"); //移除click

    $('#btn').unbind(); //移除所有
    对于只需要触发一次的，随后就要立即解除绑定的情况，用one()

    $('#btn').one("click",function(){.......});
    模拟操作

    可以用trigger()方法完成模拟操作。

    $('#btn').trigger("click");
    $('#btn').click();

    触发自定义事件

    $('#btn').bind("myclick",function(){....});

    $('#btn').trigger("myclick");
    传递数据

    trigger(type [,data])

    $('#btn').bind("myclick",function(event,message1,message2){...........});

    $('#btn').trigger("myclick",["传给message1","传给message2"]);

    执行默认操作
    $("input").trigger("focus");

        //不仅会触发input元素绑定的focus事件，还会触发默认操作——得到焦点。

    $("input").triggerHandler("focus");

        //只触发绑定事件，不执行浏览器默认操作

    其他用法

    绑定多个事件类型

    $("div").bind("mouseover mouseout",function(){.....});

    添加事件命名空间

    $("div").bind("click.plugin",function(){......});

    在所绑定的世界类型后面添加命名空间，这样在删除事件时只需要指定命名空间即可。

        $("div").unbind(".plugin");   //删除空间内的事件

    $("div").trigger("click!"); //触发所以不包含在命名空间中的click方法

    如果包含在命名空间的也要触发：

        $("div").trigger("click");

 

stopPropagation() 方法介绍：

Event 对象

定义和用法

不再派发事件。

终止事件在传播过程的捕获、目标处理或起泡阶段进一步传播。调用该方法后，该节点上处理该事件的处理程序将被调用，事件不再被分派到其他节点。

语法

event.stopPropagation()

说明

该方法将停止事件的传播，阻止它被分派到其他 Document 节点。在事件传播的任何阶段都可以调用它。注意，虽然该方法不能阻止同一个 Document 节点上的其他事件句柄被调用，但是它可以阻止把事件分派到其他节点。

//一级类别点击设置
    function setFirstClick() {
        var fa = $('.first-sort .a');
        fa.unbind(); //移除所有
        fa.each(function (i) {
            $(fa[i]).click(function () {
                   alert(1)
            });
        });
    }
    
    //二级类别点击设置
    function setSecondClick() {
        var fb = $('.first-sort .a.select .second-sort .b');
        fb.unbind(); //移除所有
        fb.each(function (i) {
            $(fb[i]).click(function (event) {
               alert(2);
                event.stopPropagation();
            });
        });
    }

    //三级类别点击设置
    function setThirdClick() {
        var fc = $('.first-sort .a.select .second-sort .b.select .third-sort .c');
        fc.unbind(); //移除所有
        fc.each(function (i) {
            $(fc[i]).click(function (event) {
              alert(3);
                event.stopPropagation();
            });
        });
    }