幫助定位元素

Question

我有以下代碼：

$(".main").click(function() { 
    $(this).toggleClass("classA").toggleClass("classB"); 
    $(".secondary").toggleClass("classC").toggleClass("classD"); 
)); 

$(".secondary").click(function() { 
    $(".secondary").toggleClass("classC").toggleClass("classD"); 
)); 

和HTML：

<div class="main"></div> 

<div> 
    <div class="secondary"></div> 
    <table class="tbl"></table> 
</div> 

<div> 
    <div class="secondary"></div> 
    <table class="tbl"></table> 
</div> 

目前，它讓我切換上課的時候每個「二級」的元素被單獨點擊或者更改所有二級當「主」被點擊時。當相應的「二級」或「主」被點擊時，我需要在適當的div中添加顯示/隱藏表格。難以瞄準。嘗試，但未能：

$(this).closest(".tbl").toggle(); 

Answer 1

試試這個：

$(".secondary").click(function() { 
    $(".secondary").toggleClass("classC").toggleClass("classD"); 
    $(this).parent().children(".tbl").toggle(); 
//or this: $(this).next(".tbl").toggle(); 
)); 

Answer 2

我不知道我究竟瞭解你問什麼，但看看這個演示：http://jsfiddle.net/Ender/DQcSE/

這裏的來源是：

$(".main").click(function() { 
    $(this).toggleClass("classA classB"); 
    $(".secondary").each(toggleSecondary); 
}); 

$(".secondary").click(toggleSecondary); 

function toggleSecondary() { 
    $(this).toggleClass("classC classD") 
      .next('.tbl').toggle(); 
} 

我已經設置了一個函數來一般地處理切換.secondary。在.main點擊處理程序中，將切換主要類，並在每個.secondary上調用secondaryToggle()函數。在.secondary點擊處理程序中，僅在單擊元素上調用secondaryToggle()。

secondaryToggle()切換該元素的類別，並選擇下一個元素（只有它具有類.tbl）並切換其可見性。

還要注意的是，你需要不叫.toggleClass()每類 - 你可以傳遞一個空格分隔的列表類的切換，就像你可以用.addClass()和.removeClass()做。