基于jquery點(diǎn)擊自以外任意處，關(guān)閉自身的代碼
更新時(shí)間：2012年02月10日 17:29:16 作者：
主要功能是點(diǎn)擊顯示，然后通過(guò)點(diǎn)擊頁(yè)面的任意位置都能關(guān)閉顯示效果，主要是$(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");
}
});
});
復(fù)制代碼 代碼如下:
<div class="down">click</div>
<div class="con hide">show-area</div>
CSS:
復(fù)制代碼 代碼如下:
.hide{display:none;}
js:
復(fù)制代碼 代碼如下:
$(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");
}
});
});
相關(guān)文章
jquery text,radio,checkbox,select操作實(shí)現(xiàn)代碼
學(xué)習(xí)jquery的朋友看參考下，對(duì)form等文本框的一些控制實(shí)現(xiàn)代碼。2009-07-07
jQuery控制frames及frame頁(yè)面JS的方法
這篇文章主要介紹了jQuery控制frames及frame頁(yè)面JS的方法,涉及jQuery針對(duì)頁(yè)面元素的判定及frame框架的操作技巧,需要的朋友可以參考下2016-03-03
jquery 圖片縮放拖動(dòng)的簡(jiǎn)單實(shí)例
本篇文章只要是對(duì)jquery 圖片縮放拖動(dòng)的簡(jiǎn)單實(shí)例進(jìn)行了介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助2014-01-01
jQuery動(dòng)態(tài)添加及刪除表單上傳元素的方法(附demo源碼下載)
這篇文章主要介紹了jQuery動(dòng)態(tài)添加及刪除表單上傳元素的方法,涉及jQuery的事件動(dòng)態(tài)綁定及頁(yè)面元素動(dòng)態(tài)操作技巧,并附帶了demo源碼供讀者下載參考,代碼非常簡(jiǎn)潔實(shí)用,需要的朋友可以參考下2016-01-01
jquery easyui滾動(dòng)條部分設(shè)置介紹
dialog并沒(méi)有隨著滾動(dòng)條往下滾動(dòng)，這時(shí)就需要用戶滑動(dòng)滾動(dòng)條來(lái)定位dialog，在說(shuō)出解決方案前先來(lái)普及一下jquery關(guān)于定位的幾個(gè)方法2013-09-09
查找iframe里面的元素在項(xiàng)目里用的還是比較多的，下面為大家介紹個(gè)方法可傳參，感興趣的朋友可以參考下2013-09-09
jQuery實(shí)現(xiàn)帶動(dòng)畫(huà)效果的二級(jí)下拉導(dǎo)航方法
這篇文章主要介紹了jQuery實(shí)現(xiàn)帶動(dòng)畫(huà)效果的二級(jí)下拉導(dǎo)航方法,涉及jQuery操作css樣式及鼠標(biāo)事件的技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-03-03
這篇文章主要介紹了jQuery表單域?qū)傩赃^(guò)濾器用法,實(shí)例分析了:checked、:enabled、:disabled:、selected等常用表單域?qū)傩赃^(guò)濾器使用技巧,需要的朋友可以參考下2015-02-02
這篇文章主要介紹了jQuery取得iframe中元素的常用方法,結(jié)合實(shí)例形式詳細(xì)分析了jQuery針對(duì)iframe中元素獲取技巧及注意事項(xiàng),需要的朋友可以參考下2016-01-01
這篇文章主要為大家詳細(xì)介紹了jquery插件實(shí)現(xiàn)輪播圖效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-04-04