如何使一個jQuery點擊事件隻影響嵌套在同一個父元素內的元素

Question

我是一個jQuery新手截至今天上午，這是我已經拿出的代碼來顯示伴隨錨的div那就是在類'foo'的div中調用它。它不工作：P

$('div.foo').children('a').click(function(event){ 
    event.preventDefault(); 
    if ($(this).closest('div').('div').is(':hidden')) { 
     $(this).closest('div').('div').show("slow"); 
    } else { 
     $(this).closest('div').('div').hide("slow"); 
    } 
}); 

HTML：

<div class="foo"> 
    <a href="#" title="">Click me!</a> 
    <div>And this will appear!</div> 
</div> 

我希望能有多個相同富的div（除了當然的嵌套div的實際內容），和所有我需要做的是將包含div的'foo'類賦值，以使包含的錨點在點擊時顯示包含的div。

這種事情甚至有可能嗎？預先感謝回覆。

Answer 1

試試這個

$('div.foo a').click(function(event){ 
    event.preventDefault(); 
    $(this).next().toggle('slow'); 
}); 

Answer 2

試試這個（假設 'div.faq' 應該是 'div.foo' 的基礎上，HTML）：

$('div.foo').children('a').click(function(event){ 
    event.preventDefault(); 

    var parent = $(this).closest('div'), 
    child = $('div', parent); 

    if (child.is(':hidden')) { 
     child.show("slow"); 
    } else { 
     child.hide("slow"); 
    } 
});