Mehrere on() oder switch() innerhalb einer on()

Question

Ich habe ein Menü auf meiner Seite und schreibe gerade das Skript, das alle Klickereignisse für die Menüschaltflächen einstellt. Jede Schaltfläche ruft eine eigene Methode auf, sodass sie explizit festgelegt werden muss.

Meine Frage, ganz einfach ist, welche der folgenden zwei Methoden besser ist in dieser Situation zu verwenden:

$(document).on('click','#menu .button', function(){ 
    switch($(this).attr('id')){ 
     case 'foo_button': 
      // Set the event for the foo button 
     break; 
     case 'bar_button': 
      // Set the event for the bar button 
     break; 
     // And the rest of the buttons 
    } 
}); 

Oder:

$(document).on('click','#foo_button',function(){ 
    // Set the event for the foo button 
}); 
$(document).on('click','#bar_button',function(){ 
    // Set the event for the bar button 
}); 
// And the rest of the buttons 

ich gedacht habe Option 1 wäre besser wäre da nur ein Ereignis gesetzt wird ... Dieses Ereignis wird jedoch bei jedem Klick auf die Menüschaltflächen aufgerufen, so dass es schwer ist zu wissen, welches effizienter wäre.

Answer 1

Wenn die Handler-Funktion für jede unterschiedliche Schaltflächen-ID wirklich unterschiedlich ist, dann sollte jede mit ihrem eigenen Aufruf an on() registriert werden.

Es wird wahrscheinlich keinen merklichen Unterschied in der Leistung Ihres Codes machen, aber es wird die Dinge in Zukunft für andere Entwickler (oder selbst für die Wartung) viel leichter lesbar machen.