js或jquery實現點擊某個按鈕或元素顯示div,點擊頁面其餘任何地方隱藏div

點擊某個元素顯示div,點擊頁面其餘任何地方隱藏div,可用javascript和jquery兩種方法實現:

一:javascript實現方法技巧
<script>
//定義stopPropagation 方法的使用,該方法將中止事件的傳播,阻止它被分派到其餘 Document 節點。
 function stopFunc(e) {
        e.stopPropagation ? e.stopPropagation() : e.cancelBubble = true;
    };
//獲取元素的ID
 function $(id) {
       return document.getElementById(id);
   };
//初始化加載
    window.onload = function () {
        document.onclick = function (e) {
            $("element").style.display = "none";
        }
        $("btn按鈕").onclick = function (e) {
            $("element").style.display = "block";
            e = e || event;
          stopFunc(e);
        }
        $("element").onclick = function (e) {
            e = e || event; stopFunc(e);
        }
    }  
</script>

二:jquery實現方法技巧:
<script>
$("#btn按鈕").on("click", function(e){
    $("#element").show();
    $(document).one("click", function(){
        $("#element").hide();
    });
    e.stopPropagation();
});
</script>
有更多更好的想法的朋友能夠聯繫我Q:1159268659
相關文章
相關標籤/搜索