垂直導航兄弟姐妹沒有關閉時，另一個打開

Question

我的垂直導航除了當我按下兄弟姐妹下拉前打開的下拉不倒塌。我想知道你能否幫助我。

這裏是我的javascript代碼，如果你想看看它在這裏充分是的jsfiddle鏈接：http://jsfiddle.net/CLNBn/2/

$('.vertical-nav ul li:has("div")').find('div').hide(); 

$('.vertical-nav li:has("div")').find('span:first').click(function() { 
    $(this).parent('li').find('span:first').toggleClass("closed opened"); 
    if ($(this).parent('li').find('span:first').attr('class') == 'closed') { 
     $(this).parent('li').find('span:first').text('+'); 
    } else { 
     $(this).parent('li').find('span:first').text('-'); 
    } 
    $(this).parent('li').find('div:first').slideToggle(); 
}); 

Answer 1

既然你已經給你的元素合理的課程，這個任務是很容易的。你想要找到所有span元素與類opened是當前li元素的兄弟姐妹的孩子，並觸發他們的click事件處理程序。

$(this).closest('li').siblings().children('span.opened').click(); 

DEMO

我也冒昧地簡化代碼：

這是可以做到的

$('.vertical-nav li:has("div")').find('span:first').click(function() { 
    var $this = $(this); 
    $this.toggleClass("closed opened"); 
    if ($this.hasClass('closed')) { 
     $this.text('+'); 
    } else { 
     $this.text('-'); 
     $this.closest('li').siblings().children('span.opened').click(); 
    } 
    $this.closest('li').find('div').first().slideToggle(); 
});​ 

正如我在我的評論說，this已經指到span元素，不需要遍歷DOM樹並再次搜索它。