jQuery點擊自身以外地方關閉彈出層的簡單實例

 本篇文章主要是對jQuery點擊自身以外地方關閉彈出層的簡單實例進行了介紹，需要的朋友可以過來參考下，希望對大家有所幫助

主要功能是點擊顯示,然後通過點擊頁面的任意位置都能關閉顯示效果,主要是$(document).click的作用   開發過程中經常有一些彈出層,彈出後要在點擊頁面其他地方時自動關閉,下面是實現代碼:   HTML代碼：   代碼如下: <div class="down">click</div> <div class="con hide">show-area</div>   CSS代碼： .hide{display:none;}   JS代碼   代碼如下: $(document).ready(function(){ $("div.down").click(function(e){ e.stopPropagation(); $("div.con").removeClass("hide"); }); $(document).click(function(){ if(!$("div.con").hasClass("hide")){ $("div.con").addClass("hide"); } }); });   OK，自己本地測試下吧，css樣式自己修改！