jquery點擊導航按鈕

Question

我有一個簡單的導航，用戶點擊並滑動，然後用戶再次單擊並滑動並關閉。目前我正在使用removeClass和addClass來更改導航打開/關閉箭頭的位置。我遇到的問題是導航打開/關閉箭頭在您點擊打開導航時會改變其位置，但是當您單擊箭頭關閉導航時，箭頭不會更改回原始位置。如果有人可以看看我的代碼，我將不勝感激！我無法弄清楚爲什麼這不起作用。謝謝！

這裏是我的代碼的鏈接http://jsfiddle.net/jsavage/QmEcs/6/

$(function(){ 
var $itemContent = $('.drop-down-nav'); 
$('.drop-down-btn').click(function(e){ 
    $('.drop-down-btn').removeClass('drop-down-btn'); 
    $('.drop-down-nav-container a').addClass('drop-down-btn-up'); 
    e.preventDefault(); 
    if($itemContent.hasClass('opened')){ 
    $itemContent.slideUp('fast').toggleClass('closed opened'); 
    } else { 
    $itemContent.slideDown('fast').toggleClass('closed opened'); 
    } 
}); 

$(function(){ 
var $itemContent = $('.drop-down-nav'); 
$('.drop-down-btn-up').click(function(e){ 
    $('.drop-down-btn-up').removeClass('drop-down-btn-up'); 
    $('.drop-down-nav-container a').addClass('drop-down-btn'); 
    e.preventDefault(); 
    if($itemContent.hasClass('opened')){ 
    $itemContent.slideUp('fast').toggleClass('closed opened'); 
    } else { 
    $itemContent.slideDown('fast').toggleClass('closed opened'); 
    } 
}); 

}）;

Answer 1

看起來你忘了在第二個函數中將類從opened更改爲closed。因此，這兩個功能都在有效地嘗試將元素向下滑動 - 而且兩者都不起作用。

Answer 2

http://jsfiddle.net/QmEcs/7/

我看不到箭頭。

但附帶的小提琴正確地將課程設置從黑色下拉到紅色，然後再次返回。

$(function(){ 
var $itemContent = $('.drop-down-nav'); 
$('.drop-down-btn-up, .drop-down-btn').click(function(e){ 
    $('.drop-down-btn-up, .drop-down-btn').toggleClass('drop-down-btn-up drop-down-btn'); 
    e.preventDefault(); 
    if($itemContent.hasClass('opened')){ 
    $itemContent.slideUp('fast').toggleClass('closed opened'); 
    } else { 
    $itemContent.slideDown('fast').toggleClass('closed opened'); 
    } 
}); 
});