jquery动态切换问题

Question

我写了这个jquery切换每个块。但是当你切换一个时，其余的也切换。

我怎样才能动态地切换（显示/隐藏）每个块独立，所以当我切换到一个部分它不切换其他部分。

注：我不能重命名该块的每个类，因为它被动态克隆。

感谢

$(document).ready(function() { 
    $('.alternatepayee-b').hide(); 

    $('.alternatepayee-checkbox').click(function() { 
    $('.alternatepayee-b').slideToggle("slow");  
    });  
}); 

标记：

<div class="alternatepayee-checkbox clearfix"> 
    <input type="checkbox" value="y" name="subscribe" id="checkbox_4"> 
    <label class="foreign" for="checkbox_4" >Alternate Payee</label> 
</div> 
<div class="alternatepayee-b clearfix" >     
    <label class="field-accoundtid arrow">Account ID 
    <input type="text" name="accountid" value="" /></label> 
    <label class="field-first arrow" >First Name 
    <input type="text" name="first_name" value="" /></label> 
    <label class="field-last arrow">Last Name 
    <input type="text" name="last_name" value="" /></label>   
</div> 

<!-- 2nd block --> 
<div class="alternatepayee-checkbox clearfix"> 
    <input type="checkbox" value="y" name="subscribe" id="checkbox_4"> 
    <label class="foreign" for="checkbox_4" >Alternate Payee</label> 
</div> 
<div class="alternatepayee-b clearfix" >    
    <label class="field-accoundtid arrow">Account ID 
    <input type="text" name="accountid" value="" /></label> 
    <label class="field-first arrow" >First Name 
    <input type="text" name="first_name" value="" /></label> 
    <label class="field-last arrow">Last Name 
    <input type="text" name="last_name" value="" /></label>   
</div> 

Answer 1

jQuery选择上组元素工作。您需要细化click事件处理程序中的选择器，以便它只适用于所需元素的一个。东西（约）像这应该工作：

$('.alternatepayee-checkbox').click(function() { 
    // 'this' refers to the single checkbox div that was actually clicked 
    // next looks for the next sibling that matches '.alternatepayee-b' 
    $(this).next('.alternatepayee-b').slideToggle("slow"); 
}); 

你用什么来.next将根据您的标记不同，但是一般的想法。另外，如果要动态添加这些内容，则可以使用.live('click', ...)来自动将事件处理程序绑定到页面加载后添加的元素。