Jquery .next（）幫助

Question

我使用下面的代碼來隱藏和顯示一堆搜索結果中的一個框。每個結果都有自己的切換和框以顯示和隱藏。我遇到的問題是，點擊任何一個切換將顯示並隱藏頁面上的所有框，而不僅僅是一個結果的框。我怎樣才能做到這一點？

感謝

jQuery(document).ready(function ($) { 

    $("div.MoreResultsTrigger").click(function (e) 
    { 
     $("div.MoreResultsTrigger").next().slideToggle('fast'); 
    }); 

}); 

更新的代碼使用HOVER

$('a.MoreResultsTrigger').hover(
     function() { 
      $(this).next().show(); 
     }, 
     function() { 
      $(this).next().hide(); 
     } 
    ); 

Answer 1

使用this關鍵字，因爲你只想旁邊一個你點擊上隱藏的元素。

jQuery(document).ready(function ($) { 

    $("div.MoreResultsTrigger").click(function (e) 
    { 
     $(this).next().slideToggle('fast'); 
    }); 

}); 

Answer 2

未經測試，但嘗試：

$("div.MoreResultsTrigger").click(function (e) 
    { 
     $(this).next().slideToggle('fast'); 
    }); 

Answer 3

使用$(this).next().slideToggle('fast');，將其應用到只有你所選擇的一個。目前它將slideToggle應用於ALL div.MoreResultsTrigger's。

Answer 4

試試這個：

jQuery(document).ready(function ($) { 

    $("div.MoreResultsTrigger").click(function() 
    { 
     $(this).next('.toggleable').slideToggle('fast'); 
    }); 

}); 

加入了「.toggleable」類的。接下來（）是以防萬一，你可能會在這之間的其他東西，你不想切換。您當然必須將.toggleable類添加到您感興趣切換的所有元素。當然，您可以替換並替換具有更多含義的名稱的toggleable。