2010-08-10 2 views
5

Comment utiliser un « ou » déclaration jquery, j'ai deux états distincts que je pense que je peux combiner pour être un seul:jquery « ou » déclaration

$('li.members').hover(function() { 
    $('.members-show').show(); 
    $('.brokers-show').hide(); 
    $('.providers-show').hide(); 
    $('.employers-show').hide(); 
    $('.seniors-show').hide(); 
    return false; 
    }); 

$('li.members-active').hover(function() { 
    $('.members-show').show(); 
    $('.brokers-show').hide(); 
    $('.providers-show').hide(); 
    $('.employers-show').hide(); 
    $('.seniors-show').hide(); 
    return false; 
    }); 
+1

si, pour une raison quelconque, combiner des sélecteurs comme Ryan l'a suggéré ne le ferait pas pour vous (théoriquement; si, par exemple, vous ajoutiez la même fonctionnalité au survol d'un élément et que vous cliquez sur un autre élément - dans votre exemple, la réponse de Ryan est en effet le chemin à parcourir), vous pourrez toujours le refactoriser, en créant un function: 'function doStuff() {...} $ ('li.members'). hover (doStuff); $ ('sthElse'). live ('click', doStuff); 'Je pensais que je devrais ajouter = = –

+0

Si vous ne vous attendez pas à inverser les fonctions' .show() 'et' .hide() ' la souris part, alors vous pouvez aussi utiliser '.mouseenter()' au lieu de '.hover()'. En ce moment, le gestionnaire tire une deuxième fois sans aucun effet visible lorsque la souris quitte 'li.members'. – user113716

Répondre

16
$('li.members, li.members-active').hover(function() { 
    $('.members-show').show(); 
    $('.brokers-show').hide(); 
    $('.providers-show').hide(); 
    $('.employers-show').hide(); 
    $('.seniors-show').hide(); 
    return false; 
    }); 
+9

Aussi: '$ ('. Courtiers-show, .providers-show, .employers-show, .seniors-show'). Hide()'. (Probablement le suffixe entier '* -show' pourrait être supprimé pour une classe CSS séparée' show', qui pourrait être ajoutée et supprimée avec 'addClass()' et 'removeClass' ...) – Tomalak

10
$('li.members, li.members-active').hover(function() { 
    $('.members-show').show(); 
    $('.members-show, .providers-show, .employers-show, .seniors-show').hide();  
    return false; 
    }); 
+1

Presque - le $(). Hide () Le sélecteur a besoin de virgules. Mais +1 pour combiner ces appels. –

1

Essayez le Multiple Selector:

$('li.members,li.members-active').hover(function() { 
    $('.members-show').show(); 
    $('.brokers-show').hide(); 
    $('.providers-show').hide(); 
    $('.employers-show').hide(); 
    $('.seniors-show').hide(); 
    return false; 
    }); 
Questions connexes