在過濾器的jquery問題需要幫助

Question

我正在使用過濾器，並希望根據過濾器懸停來顯示/隱藏div。 即我有3個過濾器組（顏色，完成和打印）這些過濾器組具有相應的單獨過濾器（如黑色，紅色/抗菌/顏料打印）。

我想在過濾器組的懸停上顯示過濾器。例如說。如果我將鼠標懸停在顏色上，則必須顯示過濾器div，如同明智一樣。以下是示例DIV結構。

<div class="list-group"> 
    <a class="list-group-item fltrHdng"> Color <i class="fa fa-angle-down"></i></a> 
    <div class="list-group-item fltr-items"> 
      <div id="filter-group21>" class="cf fltrs"> 
       <label class="checkbox cb_test"> 
        <input name="filter[]" type="checkbox" value="151"> 
       Black 
       </label> 
       <label class="checkbox cb_test"> 
        <input name="filter[]" type="checkbox" value="152"> 
       Red 
       </label> 
      </div> 
     </div> 
     <a class="list-group-item fltrHdng">Finish<i class="fa fa-angle-down"></i></a> 
     <div class="list-group-item fltr-items"> 
      <div id="filter-group23>" class="cf fltrs"> 
       <label class="checkbox cb_test"> 
        <input name="filter[]" type="checkbox" value="153"> 
        Anti bacterial 
       </label> 
      </div> 
     </div> 
     <a class="list-group-item fltrHdng">Print<i class="fa fa-angle-down"></i></a> 
     <div class="list-group-item fltr-items"> 
      <div id="filter-group24" class="cf fltrs"> 
       <label class="checkbox cb_test"> 
        <input name="filter[]" type="checkbox" value="154"> 
        Pigment print 
       </label> 
      </div> 
     </div> 
</div>   

mycode的這是不工作的.closing

$(document).ready(function(){ 
    $(".fltrHdng").mouseover(function(){ 
     $(this).closest('.fltr-items').stop().slideDown("slow"); 
    }); 
    $(".fltrHdng").mouseout(function(){ 
     $(this).closest('.fltr-items').stop().slideUp("slow"); 
    }); 
    });  

Answer 1

相反，看起來最接近的父母，你需要.next方法：

$(document).ready(function(){ 
    $(".fltrHdng").mouseover(function(){ 
     $(this).next().stop().slideDown("slow"); 
    }); 
    $(".fltrHdng").mouseout(function(){ 
     $(this).next().stop().slideUp("slow"); 
    }); 
}); 

從文檔：

• 。收盤：https://api.jquery.com/closest/
• 。接下來：https://api.jquery.com/next/