if statement checking the div hasClass

您好我想編寫的if語句是檢查div是否hasClass，如果沒有它腳本應該使用toggleClass添加它（我使用jquery ui），我寫了腳本以上whitch工作幾乎沒事，但第一個（這個）應該指向（.apla）沒有「min」類，第二個（this）應該指向（.apla）點擊（.arrow）if statement checking the div hasClass

點這是檢查如果有（.apla）打開，並且（如果有的話）（.apla）打開，腳本應該使用toggleClass（使用動畫）關閉它，並且在此腳本打開後也使用toggleClass打開（.apla），是否可以幫助我請

小提琴 - http://jsfiddle.net/eNqew/

$('.arrow').click(function(){ 
    if (!$(".apla").hasClass("min")) { 
    $(this).toggleClass("min", "slow"); 
    } else { 
    $(this).parent().parent().toggleClass("min", "slow"); 
    } 
});

UPDATE JS作品幾乎

$('.arrow').click(function(){ 
     if (!$("#apla01").hasClass("min")) { 
      $("#apla01").toggleClass("min", "slow"); 
     } 
     if (!$("#apla02").hasClass("min")) { 
      $("#apla02").toggleClass("min", "slow"); 
     } 
     if (!$("#apla03").hasClass("min")) { 
      $("#apla03").toggleClass("min", "slow"); 
     } 
     else { 
      $(this).parent().parent().toggleClass("min", "slow"); 
     } 
    });

HTML

<div id="apla01" class="apla min"> 
    <div class="apla-wraper"> 
     <div class="arrow"></div> 
    </div>  
</div> 
<div id="apla02" class="apla min"> 
    <div class="apla-wraper"> 
     <div class="arrow"></div> 
    </div>  
</div> 
<div id="apla03" class="apla min"> 
    <div class="apla-wraper"> 
     <div class="arrow"></div> 
    </div>  
</div>

CSS

#apla01.apla.min { 
    z-index: 5; 
    left: -800px; 
} 
#apla02.apla.min { 
    z-index: 4; 
    left: -760px; 
} 
#apla03.apla.min { 
    z-index: 3; 
    left: -720px; 
} 
.apla { 
    width: 838px; 
    height: 634px; 
    position: absolute; 
    top: 20px; 
    left: 0; 
    background: url(../img/bgApla.png) no-repeat -5px center; 
} 
.apla.min { 
} 
.apla-wraper { 
    position: relative; 
    width: 100%; 
    height: 100%; 
} 
.arrow { 
    width: 28px; 
    height: 28px; 
    background: url(../img/arrow.png) no-repeat 0 0; 
    position: absolute; 
    top: 50%; 
    right: -10px; 
    margin-top: -14px; 
    cursor: pointer; 
} 
.apla.min .arrow{ 
    background: url(../img/arrow.png) no-repeat -28px 0; 
}

來源

2012-07-25 gidzior

但是你發現相關容器alpa：'$（this）.closest（「。apla」）。hasClass（「min」）' – 2012-07-25 13:09:34

試試這個：

$('.arrow').click(function(){ 
    var $currentApla = $(this).parent().parent() 
    $('.apla:not(.min)').not('#'+$currentApla.attr('id')).toggleClass("min", "slow"); 
    $currentApla.toggleClass("min", "slow") 
});

希望這有助於:)

來源

2012-07-25 13:39:01

點擊後沒有任何動作，所以一些錯誤 – gidzior 2012-07-25 13:54:16

@gidzior - 我試過這個新版本的yout jsFidle，它似乎工作 – 2012-07-25 14:21:30

是：] thx隊友 – gidzior 2012-07-25 14:27:00

你會01後因爲它返回true或false

$('.arrow').click(function(){ 
    if (!$(".apla").is(".min")) { 
    $(this).toggleClass("min", "slow"); 
    } else { 
    $(this).parent().parent().toggleClass("min", "slow"); 
    } 
});

來源

2012-07-25 13:05:26

它不是答案我的問題，但thx無論如何 – gidzior 2012-07-25 13:23:34

哇，我錯過了那裏的一個伎倆：我以爲你看到檢查.apla是否有一類.min大聲笑哎呀 – 2012-07-25 13:25:40

這赤父.alpa類：

$('.arrow').click(function(){ 
     $('.apla').not('.min').not($(this)).toggleClass("min", "slow"); 
     $(this).closest(".apla").toggleClass("min", "slow"); 
    });

來源

2012-07-25 13:43:27

你的代碼打開和關閉點擊（.apla） – gidzior 2012-07-25 13:52:19

@ gidzior你可以嘗試複製你的代碼在[小提琴]（http://jsfiddle.net），我不確定要正確地延長髮生什麼。 – 2012-07-25 14:01:55

http://jsfiddle.net/eNqew/ – gidzior 2012-07-25 14:11:35

if statement checking the div hasClass

回答

相關問題