zoukankan      html  css  js  c++  java
  • 解决jquery绑定click事件出现点击一次执行两次问题

    问题定位:通过浏览器F12定位到点击一次出现两次调用。

    问题复现:

    $("#mail_span").on("click",function(){
            if($(".treeselect").children(".treeselect-up").css("display")=="none"){
                treeSelectClick();
                var $up = $(".treeselect").find(".treeselect-up");
                $up.css({
                    display : "block"
                });
                $("#mail_bottom").attr("class", "glyphicon glyphicon-triangle-top");
            }else{
                treeSelectClick();
                $("#mail_bottom").attr("class", "glyphicon glyphicon-triangle-bottom");
            }
        }
    })
    View Code

    问题解决:

    $("#mail_span").on("click",function(e){
        if(!e.isPropagationStopped()){//确定stopPropagation是否被调用过
            if($(".treeselect1").children(".treeselect-up").css("display")=="none"){
                treeSelectClick();
                var $up = $(".treeselect1").find(".treeselect-up");
                $up.css({
                    display : "block"
                });
                $("#mail_bottom").attr("class", "glyphicon glyphicon-triangle-top");
            }else{
                treeSelectClick();
                $("#mail_bottom").attr("class", "glyphicon glyphicon-triangle-bottom");
            }
        }
        e.stopPropagation();//必须要,不然e.isPropagationStopped()无法判断stopPropagation是否调用过
    })
    View Code

    查阅资料:

    event.preventDefault() :阻止默认行为,可以用 event.isDefaultPrevented() 来确定preventDefault是否被调用过了
    event.stopPropagation() :阻止事件冒泡,事件是可以冒泡的,为防止事件冒泡到DOM树上,不触发任何前辈元素上的事件处理函数,可以用 event.isPropagationStopped() 来确定stopPropagation是否被调用过了

  • 相关阅读:
    X3850M2安装CertOS 7 KVM 2--Mount
    X3850M2安装CertOS 7 KVM 2--VNC
    X3850M2安装CertOS 7 KVM
    vs2012 opencv 配置
    asp.net MVC code first Migrations : Model 同步到DB中
    HyperV采用硬盘拷贝的方式迁移虚拟机后的问题处理
    事后诸葛亮
    个人作业——软件产品案例分析
    冲刺总结随笔
    Alpha第九天
  • 原文地址:https://www.cnblogs.com/donchen/p/10075790.html
Copyright © 2011-2022 走看看