JQuery le plus proche() aider

Question

donc j'ai plusieurs conteneurs avec ce balisage sur une page:

 <div class="box w400"> 
      <div class="box-header"> 
       <span class="expand-collapse">expand/collapse</span> 
       <h3>Heading</h3> 
      </div> 
      <div class="box-content"> 
       <p>Some content here...</p> 
      </div> 
     </div> 

Et je suis en train de réaliser que après avoir cliqué sur sur la durée .expand-effondrement, la div .box contenu va glisser vers le haut ou vers le bas (bascule).

Voici jQuery J'utilise, je suis en train de réaliser cela avec le plus proche():

 $(document).ready(function() { 
      $('.expand-collapse').click(function() { 
       $(this).closest('.box-content').slideToggle('slow'); 
      }); 
     }); 

Mais il ne fonctionne pas pour une raison quelconque :(

Answer 1

Essayez ceci:

$(document).ready(function() { 
    $('.expand-collapse').click(function() { 
     $(this).parent().next('.box-content').slideToggle('slow'); 
    }); 
}); 

qui sélectionne le prochain frère du div parent, il ne fait pas usage de la plus proche.

Answer 2

Le plus proche() trouve l'élément parent ferme. Dans votre cas, la plage n'a aucun élément parent avec la classe .box-content. pourquoi ne pas simplement faire $ ('. box-content'). slideToggle ('slow'); ??

edit: J'ai raté la partie où vous en avez plusieurs sur une page. le parent(). next devrait fonctionner.