DIESER DATUM-PICKER HAT DIE FUNKTIONALITÄT IM NACHT. Ссылка
Aber ich benutze dieses Plugin , wie bekomme ich das aktuelle Datum, über dem die Maus schwebt? Für ein Beispiel, wenn ich den 23. Februar 2016 schwebe, wie bekomme ich das Datum 23.? getDate
wird erst ausgelöst, wenn ich auf ein Datum klicke. Also aktuelles Datum beim Hover? Vielen Dank
HINWEIS
Ich habe jquery-ui und bootstrap datepicker beide auf derselben Seite, also gab es einen Konflikt. Um den Konflikt zu lösen, verwende ich bootstrapDP
anstelle von datepicker
.
Mein HTML
%Vor%Meine JS
%Vor% Der Datepicker wird als HTML-Datenattribut in der input
gespeichert, an die er gebunden ist, und ist somit zugänglich mit:
Bei der Überprüfung des Objekts datepicker
werden zwei nützliche Eigenschaften angezeigt, die erste ist die Eigenschaft viewDate
. Dies speichert lediglich das Datum der aktuellen Monatsansicht (kein bestimmter Tag, aber das ist zu diesem Zeitpunkt nicht wichtig, da wir dies programmatisch feststellen werden).
Die zweite Eigenschaft, die wir benötigen, ist die Eigenschaft picker
. Dies gibt uns den DOM-Knoten, unter dem der Picker existiert:
Und von dort aus ist es ein einfaches DOM-Traversal, um die Tag-Elemente zu erreichen (sie sind alle TD
-Elemente mit der Klasse 'Tag'):
Wenn man alles zusammenfasst, könnte man den aktuellen Tag, an dem man schwebt, mit:
bekommen %Vor% Wir müssen uns dann damit befassen, dass sich die day
-Zellen auf die vorherigen oder nächsten Monate beziehen können. Glücklicherweise wird dies durch das Vorhandensein der Klassen old
(für letzten Monat) und new
(für nächsten Monat) hervorgehoben.
Unter Verwendung dieser Informationen, kombiniert mit der oben besprochenen Eigenschaft viewDate
, können wir einige Datumsmanipulationen durchführen, um das aktuelle Datum festzulegen (beachten Sie die zusätzlichen Prüfungen, um zu gewährleisten, dass Jahr und Monat geändert werden) ein Monat vom ersten oder letzten Monat des Jahres):
Hinweis : Date.getMonth()
gibt eine ganze Zahl im Bereich 0.11 zurück (0 ist der Januar, 11 ist der Dezember). Dies ist wichtig zu erinnern.
Versuchen Sie dies, überprüfen Sie die Konsole für die Ausgabe, Geigenverbindung Ссылка
%Vor%hoffe das hilft ..:)
Der interessante Teil dieses Codes ist:
%Vor% Sie können das numerische Datum aus $(".bootstrapDP td.day")
extrahieren, wie im Code gezeigt. Der Monat und das Datum stammen von $(".bootstrapDP-switch")
, können sich aber unterscheiden, wenn Sie über einem Datum des "letzten" oder "nächsten" Monats verweilen.
Deshalb habe ich auch einen Helfer function getMonthYear
im Lösungscode zur Verfügung gestellt, der bestimmt, ob Sie ' im letzten oder nächsten Monat und kehren entsprechend zurück. Andere Monate können aus $(".bootstrapDP-months")
extrahiert werden, wenn eines der angezeigten Daten ausgewählt wird, die in den "nächsten" oder "letzten" Monat fallen.
Im Moment habe ich darauf hingewiesen, dass das Überfahren eines deaktivierten Datums keine Auswirkungen hat. Dies könnte durch Entfernen der Zeile if(x.hasClass("disabled")) { return; }
Diese Lösung baut auf der vorherigen Lösung von @mike tracker auf.
Tags und Links jquery twitter-bootstrap-3