美文网首页JavaScript
js:点击别处隐藏div

js:点击别处隐藏div

作者: 思无邪cc | 来源:发表于2017-03-07 13:47 被阅读64次

    html代码(简化):

    <span id="rule">规则</span>
    
    <div style="display:none" class="wxbgc1" id="hd_rule">
        <p id="hd_rule_p">
          <b>活动规则</b>
        </p>
    </div>
    

    js代码:

    $(document).bind('click', function(e) {  
        var e = e || window.event; //浏览器兼容性   
        var elem = e.target || e.srcElement;  
        while (elem) { //循环判断至跟节点,防止点击的是div子元素   
            if (elem.id && elem.id == 'hd_rule_p') {  
                return;
            }
            if (elem.id && elem.id == 'rule') {  
                $("#hd_rule").css("display","block");
                return;
            }
            elem = elem.parentNode;  
        }  
        $('#hd_rule').css('display', 'none'); //点击的不是div或其子元素   
    }); 
    

    相关文章

      网友评论

        本文标题:js:点击别处隐藏div

        本文链接:https://www.haomeiwen.com/subject/zodmgttx.html