2010-11-18 7 views
0
<div class="contacts"> 
       <h3><a href="#">1st Link</a></h3> 

       <div class="contacts-details"> 
       <div class="tel" title="telephone"> 
        <p>9806648110</p> 
         <p>9806648110</p> 
        </div> 
        <div class="fax" title="fax"> 
        <p>9806648110</p> 
         <p>9806648110</p> 
        </div> 

        <div class="email" title="email"> 
        <p>[email protected]</p> 
         <p>[email protected]</p> 
        </div> 

        <div class="postal" title="postal"> 
        <p>uttam chowk-10, pokhara, nepal</p> 
        </div> 
       </div><!-- end .contacts-details --> 
      </div><!-- end .contacts --> 

      <div class="contacts"> 
       <h3><a href="#">2nd Link</a></h3> 

       <div class="contacts-details"> 
       <div class="tel" title="telephone"> 
        <p>9806648110</p> 
         <p>9806648110</p> 
        </div> 
        <div class="fax" title="fax"> 
        <p>9806648110</p> 
         <p>9806648110</p> 
        </div> 

        <div class="email" title="email"> 
        <p>[email protected]</p> 
         <p>[email protected]</p> 
        </div> 

        <div class="postal" title="postal"> 
        <p>uttam chowk-10, pokhara, nepal</p> 
        </div> 
       </div><!-- end .contacts-details --> 
      </div><!-- end .contacts --> 


      <div class="contacts"> 
       <h3><a href="#">3rd Link</a></h3> 

       <div class="contacts-details"> 
       <div class="tel" title="telephone"> 
        <p>9806648110</p> 
         <p>9806648110</p> 
        </div> 
        <div class="fax" title="fax"> 
        <p>9806648110</p> 
         <p>9806648110</p> 
        </div> 

        <div class="email" title="email"> 
        <p>[email protected]</p> 
         <p>[email protected]</p> 
        </div> 

        <div class="postal" title="postal"> 
        <p>uttam chowk-10, pokhara, nepal</p> 
        </div> 
       </div><!-- end .contacts-details --> 
      </div><!-- end .contacts --> 

Comment sélectionner le div suivant (« .Contacts-détails ») du h3 lorsque « h3 un » est cliqué, puis appliquez slideToggle() à elle?sélectionnez la div suivante de l'élément cliqué avec jquery

s'il vous plaît aider

Répondre

2
$('h3 a').click(function() { 
    $(this).parent().siblings('div.contacts-details').slideToggle(); 
}); 
+0

ou suivant() dans lequel je pense est plus rapide dans ce cas – tbleckert

+0

peut u s'il vous plaît suggérer une façon de sélectionner le div parent (div.contacts -détails) et lui appliquer toggleClass()? merci – sonill

+0

j'ai essayé "$ (this) .parent(). toggleClass ('selected');" et cela n'a pas fonctionné. il a appliqué la classe à h3 au lieu de parent div – sonill

0

Essayez cette

$('h3 a').click(function(e) { 
    e.preventDefault(); 
    $(this).parent().next('.contacts-details').slideToggle(); 
}); 
+0

Je me sens comme 'next()' ne devrait être utilisé que lorsque vous ne vous en souciez pas à propos de ce qui est à venir. Si vous voulez que votre code fonctionne pour toujours, la recherche de l'élément exact que vous voulez me semble être une meilleure idée? –

+0

Alors qu'est-ce qui ne va pas avec next ('. Contacts-details')? Je pensais que vous verriez mon point – tbleckert

+0

Si vous écrivez vous html correctement, contacts-détails devrait être l'élément suivant. – tbleckert

Questions connexes