jQuery Event-Handler mit mehreren Links nicht funktionieren

Question

Ich versuche, die jQuery UI-Datepicker anhängen, und ich kann den Event-Handler Arbeits nicht erhalten:

$('.ui-datepicker').on('click', 'a.ui-datepicker-next', 'a.ui-datepicker-prev', function(event) { 
    event.preventDefault(); 
     console.log("CLICK"); 
}); 

Ich habe nichts Protokollierung der bekam Konsole, wenn ich auf die Links klicke. Hier ist der html:

<div id="ui-datepicker-div" class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all"...> 
    <div class="ui-datepicker-header ui-widget-header ui-helper-clearfix- ui-corner-all"> 
     <a class="ui-datepicker-next ui-corner-all"...></a> 
     <a class="ui-datepicker-prev ui-corner-all"...></a> 
     ... 

Was muss ich als Event-Handler setzen, um dies auszulösen? Die jQuery ist in einem <script>jQuery here</script> in der Fußzeile meines HTML.

EDIT: Links waren falsch - a.ui-datepicker-month und a.ui-datepicker-yeargeänderta.ui-datepicker-next und a.ui-datepicker-prev

Dank

Answer 1

Ihre Syntax ist nicht ganz richtig. Die Selektoren müssen durch Kommas getrennt sein, aber in derselben Zeichenfolge. Versuchen Sie Folgendes:

$('.ui-datepicker').on('click', 'a.ui-datepicker-month, a.ui-datepicker-year', function(e) { 
    e.preventDefault(); 
    console.log("CLICK"); 
}); 

Hinweis: 'a.ui-datepicker-month, a.ui-datepicker-year'. Beachten Sie auch die Verwendung von e, nicht event, da dies das globale Ereignisobjekt, das einige Browser haben, überschreiben wird.

* Update nach Frage bearbeitet wurde:

ist es zwei andere Fragen. Erstens sind die korrekten Klassen a.ui-datepicker-prev und a.ui-datepicker-next. Außerdem existiert das ui.-datepicker -Element beim Laden des DOM nicht, daher gibt es nichts, an das das Ereignis gebunden werden könnte. Um dies zu beheben, können Sie $(document) verwenden, obwohl Sie idealerweise das nächste übergeordnete Element zu den Elementen verwenden sollten, auf die Sie beim Laden im DOM ausgerichtet werden sollen. Versuchen Sie folgendes:

$(document).on('click', 'a.ui-datepicker-prev, a.ui-datepicker-next', function(e) { 
    e.preventDefault(); 
    console.log("CLICK"); 
}); 

Working example