2013-10-13 5 views
2

Je cherche à voir s'il y a un moyen plus efficace pour le code suivant: merci :)Comment combiner plusieurs fonctions IF avec jQuery?

$(".menu").click(function() { 
$(".submenu").slideToggle("fast", function() { 
// Animation complete. 
}); 
}); 

$(".menu2").click(function() { 
$(".submenu2").slideToggle("fast", function() { 
// Animation complete. 
}); 
}); 

$(".menu3").click(function() { 
$(".submenu2").slideToggle("fast", function() { 
// Animation complete. 
}); 
}); 

Répondre

1
$.each([1,2,3], function(index) { 
    $(".menu"+index).click(function() { 
    $(".submenu"+index).slideToggle("fast", function() { 
    // Animation complete. 
    }); 
    }); 
} 
+0

c'est vraiment cool Neeraj, merci :) pouvez-vous me dire pourquoi le dernier menu ne se ferme pas ou bascule quand on clique sur le menu principal? http://jsbin.com/iwUNAwO/1/edit – user2844139

0
$(".menu").click(function() { 
    $(".submenu").slideToggle("fast", function() { 
    // Animation complete. 
    }); 
}); 

$(".menu2,.menu3").click(function() { 
    $(".submenu2").slideToggle("fast", function() { 
    // Animation complete. 
    }); 
}); 
1

Vous pouvez faire quelque chose comme cela en utilisant [attribut commence par Selector [nom^= "valeur"]] et utilisez le nom de la classe pour obtenir le numéro commun pour submenu classe 1.

$("[class^=menu]").click(function() { 
    num = this.className.replace('menu', '') 
    $(".submenu" + num).slideToggle("fast", function() { 
    // Animation complete. 
    }); 
}); 
0

ok merci à ceux qui ont commenté j'ai trouvé deux façons de faire un jQuery plus logique. merci à tous pour votre aide, n'aurait pas pu le faire sans vous !!! Par exemple, j'ai essayé l'exemple de Neeraj mais j'ai eu un problème avec le dernier menu/sous-menu qui ne se fermait pas avec JSBin. Avec un peu d'essai et d'erreur, il semblait qu'en ajoutant un autre numéro (dans ce cas, 4) cela permettait maintenant au menu/sous-menu # 3 d'ouvrir/fermer parfaitement. Je ne sais pas pourquoi mais ça a marché pour moi!

$.each([1,2,3], function(index) { 
$(".menu"+index).click(function() { 
$(".submenu"+index).slideToggle("fast", function() { 
// Animation complete. 
}); 
}); 
} 

merci encore!

J'ai également remarqué que JSBin est un excellent outil (il montre toutes les erreurs avec la police rouge qui est facilement remarquée). JSfiddle est également idéal lorsque vous voulez «ranger» votre code, ce qui est un gain de temps réel! Mon site Web arrive vraiment et je ne pourrais pas être plus heureux. merci à tous ceux qui ont fait des commentaires et des exemples.

Questions connexes