jQuery if class is x do something，else do something else

我想動畫一個div if class等於活動，否則我想tabItem爲top: 0; - 我遇到的問題是其他人似乎沒有觸發，我無法弄清楚爲什麼。jQuery if class is x do something，else do something else

預期的效果是，一次只有一個項目處於活動狀態，只有活動項目具有負的頂部位置。

對於工作示例，請參閱：http://codepen.io/anon/pen/xIovs

的jQuery：

var tabItem = $(".tab--hobbit"); 

     function closeTab(){ 
      tabItem.removeClass("active"); 
     } 

     tabItem.click(function(event) { 
      event.preventDefault(); 

      closeTab(); 
      $(this).addClass("active"); 

      if ($(this).hasClass('active')) { 
       $(this).animate({ 
        top: -168 
       }); 
      } else { 
       $(tabItem).animate({ 
        top: 0 
       }); 
      } 

     });

來源

2014-03-03 Doidgey

你在IF之前加入了「active」類，所以它永遠不能到達else？ – ConorLuddy

這是因爲你是c阿靈addClass()，使所述類被添加到所述元件，如果它不存在

var tabItem = $(".tab--hobbit"); 

tabItem.click(function (event) { 
    event.preventDefault(); 

    tabItem.not(this).removeClass("active").animate({ 
     top: 0 
    }); 
    $(this).toggleClass("active"); 
    $(this).animate({ 
     top: $(this).hasClass('active') ? -80 : 0 
    }); 

});

還存在與closeTab方法中的問題，則應該從比當前元素作爲其它所有元素清除活性類如上所示

來源

2014-03-03 11:40:57

哦，我得到這個，雖然經過測試，這隻關閉他們所有人，你再次點擊一次它的動畫，而不是關閉非活動選項卡？除非我應用錯誤的東西。 – Doidgey

哦，我明白了，所以當你點擊一個標籤來激活它時，它會向上移動。再次單擊該選項卡意味着您到達其他部分，因此它關閉。我會如何去製作其他標籤打開關閉後點擊另一個選項卡，並使其活動？ – Doidgey

@ Mat-visual查看更新 - http://codepen.io/arunpjohny/pen/AoKsw –

您有：

$(this).addClass("active"); 

if ($(this).hasClass('active')) {

所以當然總是有積極類..

來源

2014-03-03 11:40:52 Hardy

我剛把代碼的其他部分移到了CloseTab。我認爲它正在工作。

function closeTab(){ 
     tabItem.removeClass("active"); 
      $(tabItem).animate({ 
       top: 0 
      }); 

    } 

    tabItem.click(function(event) { 
     event.preventDefault(); 

     closeTab(); 
     $(this).addClass("active"); 

      $(this).animate({ 
       top: -168 
      }); 

    });

來源

2014-03-03 11:57:40 Thangadurai

jQuery if class is x do something，else do something else

回答

相關問題