阻止事件冒泡之显示与隐藏的切换案例

要求:
1.点击按钮能够切换显示与隐藏
2.点击任何元素都能够隐藏

<script>
    $(".button").click(function () {
        if(parseInt($(".box_content").css("height"))==0){
            $(".box_content").css({height:"200px"});
            // 阻止事件冒泡
            return false
        }else{
            $(".box_content").css({height:0});
            // 阻止事件冒泡
            return false
        }
    });
    //点击其他地方让弹出栏缩回
    $("body").click(function () {
        $(".box_content").css({height:0});
    })
    $("iframe").on("load", function(event){//判断iframe是否加载完成
        $("body",this.contentDocument).click(function(){//添加点击事件
            $(".box_content").css({height:0});
        });
    });
</script>

猜你喜欢

转载自blog.csdn.net/weixin_39150852/article/details/85079482
今日推荐