ID des Kalenders div beim Klicken auf die Schaltfläche next/prev im Kalender in jquery

Ich habe mehrere Kalender auf meiner Seite mit jquery UI angezeigt. Die Kalender funktionieren gut. Ich versuche die ID des Kalenders zu erhalten, wenn ich auf den nächsten oder vorherigen Knopf im Kalender klicke. Der Code, den ich verwende, ist dies:ID des Kalenders div beim Klicken auf die Schaltfläche next/prev im Kalender in jquery

<div class="calendar" id="calendar1"></div> 
<div class="calendar"id="calendar2"></div> 
<div class="calendar" id="calendar3"></div>

und jQuery-Code ist

$('.calendar').datepicker({ 
    inline: true, 
    firstDay: 1, 
    showOtherMonths: true, 
    dayNamesMin: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'] 
}); 
$(document).on('click', '.ui-datepicker-next', function() { 
    console.log($(this).parent().parent().parent().attr('id')); 
});

es zeigen sollte calendar1/Calendar2/calendar3 sondern auf id anzeigt es undefiniert zeigt. Der Datepicker html ist diese

<div class="calendar hasDatepicker" id="calendar1"> 
    <div class="ui-datepicker-inline ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all" style="display: block;"> 
    <div class="ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-all"> 
     <a class="ui-datepicker-prev ui-corner-all" onclick="DP_jQuery_1488149175514.datepicker._adjustDate('#calendar50', -1, 'M');" title="Prev"> 
     <span class="ui-icon ui-icon-circle-triangle-w">Prev</span> 
     </a> 
     <a class="ui-datepicker-next ui-corner-all" onclick="DP_jQuery_1488149175514.datepicker._adjustDate('#calendar50', +1, 'M');" title="Next"> 
     <span class="ui-icon ui-icon-circle-triangle-e">Next</span> 
     </a>

wie wir die Mutter Anruf richtig sehen können und es funktioniert, wenn ich

verwenden

console.log($('.ui-datepicker-next').parent().parent().parent().attr('id'));

aber das wird die ID des ersten div dh calendar1 immer geben.

Quelle

2017-02-26 Amar JS

Das Problem in der mehrere Verkettung von 'Eltern sein wird()'. Ich kann nicht wirklich sehen, wo genau '.ui-datepicker-next' dynamisch erstellt wird, aber es merkt an, dass es eine div ** separate ** zu der Eingabe erstellt. Sie müssen ein 'find()' an das Zielfeld ketten, bevor Sie die ID erhalten. Es sollte immer noch ** einige ** ID zurückgeben, also ich vermute, Sie haben möglicherweise zu viele Elternselektoren verwendet. Versuchen Sie zuerst, '$ (this)' zu loggen, und bearbeiten Sie dann die Kette von dort :) –

können Sie mehr von Ihrem HTML hinzufügen? meistens meine ich Teile einschließlich ui-datepicker-next –

Wie der Docs seine: onChangeMonthYear(Integer year, Integer month, Object inst)

onChangeMonthYear:function(year, month, instance){ 

    console.log(instance.id) 

}

So versuchen Sie es mit:

$('.calendar').datepicker({ 
    inline: true, 
    firstDay: 1, 
    showOtherMonths: true, 
    dayNamesMin: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'], 
    onChangeMonthYear:function(year, month, instance){ 

     console.log(instance.id) 

    } 
});

Quelle

2017-02-26 23:33:59

ID des Kalenders div beim Klicken auf die Schaltfläche next/prev im Kalender in jquery

Antwort

Verwandte Themen