jQuery判斷一個元素是否可見的方法
本文實例講述了jQuery判斷一個元素是否可見的方法。分享給大家供大家參考。具體如下:
jQuery 可以很容易地確定一個元素是可見的或是隱藏的,然后分別做不同的處理。如:我想根據(jù)某 div 是否可見,在按鈕上顯示不同的文字和圖標。可以這樣實現(xiàn):
方法一:
$('#para_div button').click(function() {
if($(this).next().is(":visible")) {
//$(this).html('顯示');
$(this).css({"background":"url(/images/btn_arrow_down.png) no-repeat"});
}
else {
//$(this).html('隱藏');
$(this).css({"background":"url(/images/btn_arrow_up.png) no-repeat"});
}
$(this).next().slideToggle('fast');
});
方法二:
$('#para_div button').click(function() {
if($(this).next().css('display') == 'none') {
//$(this).html('隱藏');
$(this).css({"background":"url(/images/btn_arrow_up.png) no-repeat"});
}
else{
//$(this).html('顯示');
$(this).css({"background":"url(/images/btn_arrow_down.png) no-repeat"});
}
$(this).next().slideToggle('fast');
});
方法三:
$('#para_div button').click(function() {
var $cn = $(this).next();
//$(this).html(($cn.is(":visible")) ? '顯示' : '隱藏');
(this).css(($cn.is(":visible")) ?
{"background":"url(images/btn_arrow_down.png) no-repeat"} :
{"background":"url(images/btn_arrow_up.png) no-repeat"});
$cn.toggle('fast');
});
希望本文所述對大家的jQuery程序設(shè)計有所幫助。
相關(guān)文章
jquery獲取input type=text中的值的各種方式(總結(jié))
下面小編就為大家?guī)硪黄猨query獲取input type=text中的值的各種方式(總結(jié))。小編覺的挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-12-12
jquery無法設(shè)置checkbox選中即沒有變成選中狀態(tài)
設(shè)置以后checkbox并沒有變成選中狀態(tài),用chrome調(diào)試看了一下,checkbox中確實有checked屬性,針對這個問題,大家可以參考下本文2014-03-03
ASP.NET jQuery 實例8 (動態(tài)添加內(nèi)容到DropDownList)
在web應(yīng)用里,我們經(jīng)常需要通過其他控件的事件觸發(fā)動態(tài)構(gòu)造DropDownList數(shù)據(jù)內(nèi)容。在這節(jié)中,我們將會看到如何實現(xiàn)通過選擇第一個下來框的內(nèi)容來動態(tài)構(gòu)造第二個下拉框的內(nèi)容2012-02-02
jquery mobile實現(xiàn)撥打電話功能的幾種方法
在做一個便民服務(wù)電話,用到移動web中列出的電話,點擊需要實現(xiàn)調(diào)用通訊錄,撥打電話功能,有需要的朋友可以參考一下2013-08-08
jQuery實現(xiàn)合并/追加數(shù)組并去除重復(fù)項的方法
這篇文章主要介紹了jQuery實現(xiàn)合并/追加數(shù)組并去除重復(fù)項的方法,可實現(xiàn)合并兩個數(shù)組并出去重復(fù)項的功能,涉及數(shù)組的遍歷、判斷、追加等相關(guān)操作技巧,需要的朋友可以參考下2018-04-04
有關(guān)jQuery中parent()和siblings()的小問題
本文通過一個實例給大家介紹有關(guān)parent()和siblings()問題原因及解決方案,非常不錯具有參考借鑒價值,感興趣的朋友一起看看吧2016-06-06
使用CSS和jQuery模擬select并附提交后取得數(shù)據(jù)的代碼
使用CSS和jQuery模擬select并實現(xiàn)提交后取得數(shù)據(jù),詳細實現(xiàn)及截圖如下,感興趣的朋友可以參考下2013-10-10
用jquery實現(xiàn)動畫跳到頂部和底部(這個比較簡單)
用jquery實現(xiàn)動畫的跳到頂部和底部,當點擊頂部按鈕的時候,執(zhí)行方法,scrollTop屬性獲取選中標簽距滾動條的距離2014-09-09
jquery trigger實現(xiàn)聯(lián)動的方法
這篇文章主要介紹了jquery trigger實現(xiàn)聯(lián)動的方法,結(jié)合實例形式分析了trigger的具體使用技巧,需要的朋友可以參考下2016-02-02

