2010-10-19 18 views
1

Quelle est la meilleure façon d'optimiser les extraits suivants qui utilisent delegate()?Optimisation des délégués jQuery

jQuery('.menu').delegate('li.gallery', 'hover', function() { jQuery(this).children('.submenu').toggleClass('hide show'); }); 
jQuery('.menu').delegate('li.interior', 'hover', function() { jQuery(this).children('.submenu').toggleClass('hide show'); }); 
jQuery('.menu').delegate('li.exterior', 'hover', function() { jQuery(this).children('.submenu').toggleClass('hide show'); }); 


<li class="gallery"> 
        <span>gallery</span> 
        <ul class="submenu hide"> 
         <li class="interior"> 
          <a href="/gallery/interior">Interior</a> 
          <ul class="submenu hide"> 
           <li><a href="/gallery/interior?gallery=master-bedroom">Master Bedroom</a></li> 
           <li><a href="/gallery/interior?gallery=living-room">Living Room</a></li> 
           <li><a href="/gallery/interior?gallery=dining-room">Dining Room</a></li> 
           <li><a href="/gallery/interior?gallery=kitchen">Kitchen</a></li> 
           <li><a href="/gallery/interior?gallery=bathroom">Bathroom</a></li> 
           <li><a href="/gallery/interior?gallery=foyer">Foyer</a></li> 
           <li><a href="/gallery/interior?gallery=study">Study</a></li> 
           <li><a href="/gallery/interior?gallery=sunroom">Sunroom</a></li>         
           <li><a href="/gallery/interior?gallery=guest-room">Guest Room</a></li>                
          </ul> 
         </li> 
         <li class="exterior"> 
          <a href="/gallery/exterior">Exterior</a> 
          <ul class="submenu hide"> 
           <li><a href="/gallery/exterior?gallery=landscapes">Landscape</a></li> 
           <li><a href="/gallery/exterior?gallery=gardens">Gardens</a></li> 
           <li><a href="/gallery/exterior?gallery=cottages">Cottages</a></li> 
           <li><a href="/gallery/exterior?gallery=entry-driveway">Entry/Driveway</a></li>                        
          </ul> 
         </li>      
        </ul> 
       </li> 
+0

ce que vous optimisez pour? lisibilité? la vitesse? extensibilité? –

+0

lisibilité et vitesse. aucune intention d'échelle. –

+0

Y compris '.menu' serait un début. –

Répondre

2

Vous pouvez utiliser un multiple selector (,) dans le paramètre de sélection .delegate().

Cependant, en raison de what I would consider a bug in how .delegate() works (hors mouseover/mouseout, qui se déclenche lors de l'entrée d'un enfant) j'orienter clairement qu'il pour l'instant et se lient directement, comme ceci:

jQuery('.menu').find('li.gallery, li.interior, li.exterior').hover(function() { 
    jQuery(this).children('.submenu').toggleClass('hide show'); 
}); 
+0

Je pensais aussi, mais quand je reçois je survole le sous-menu, le premier déclic déclenche à nouveau. J'ai ajouté le balisage ci-dessus. –

+0

@matt - Quelle version de jQuery utilisez-vous? 'hover' n'a pas été ajouté correctement jusqu'à récemment. –

+0

@nick 1.4.2, je pense que la seule version avec délégué. –