zoukankan      html  css  js  c++  java
  • 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.stopPropagation()

    说明

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

     1 //一级类别点击设置
     2     function setFirstClick() {
     3         var fa = $('.first-sort .a');
     4         fa.unbind(); //移除所有
     5         fa.each(function (i) {
     6             $(fa[i]).click(function () {
     7                    alert(1)
     8             });
     9         });
    10     }
    11     
    12     //二级类别点击设置
    13     function setSecondClick() {
    14         var fb = $('.first-sort .a.select .second-sort .b');
    15         fb.unbind(); //移除所有
    16         fb.each(function (i) {
    17             $(fb[i]).click(function (event) {
    18                alert(2);
    19                 event.stopPropagation();
    20             });
    21         });
    22     }
    23 
    24     //三级类别点击设置
    25     function setThirdClick() {
    26         var fc = $('.first-sort .a.select .second-sort .b.select .third-sort .c');
    27         fc.unbind(); //移除所有
    28         fc.each(function (i) {
    29             $(fc[i]).click(function (event) {
    30               alert(3);
    31                 event.stopPropagation();
    32             });
    33         });
    34     }    
    点击事件排除父级标签
  • 相关阅读:
    TClientDataSet[6]: 读取 TClientDataSet 中的图片数据
    TClientDataSet[2]: Data、XMLData
    TClientDataSet[5]: 读取数据
    TClientDataSet[1]: 浏览测试数据
    TClientDataSet[3]: 手动建立数据集
    从哪查找当前程序所有可用的环境变量?
    使用多窗体时, 关于节约内存和加快启动速度的思考与尝试
    一句话获取文件的最新修改时间
    用 SuperObject 解析淘宝上的 Json 数据 回复 "macrolen" 的问题
    “生气”的经典解释
  • 原文地址:https://www.cnblogs.com/danlis/p/6647063.html
Copyright © 2011-2022 走看看