Datepicker mit jQuery UI

Einige davon mit einer komplizierteren Programmierung als andere oder einfach ihre Implementierung kann ziemlich mühsam sein, aber jQuery und sein Bibliothekspaket geben uns Methoden zum Erstellen Datumsauswahl schnell und effizient mit modernster Konstruktion und Bedienung.
Die Datepicker()-Methode
Die Methode von Datumsauswahl () Ändern Sie das Aussehen des HTML durch Hinzufügen einer neuen CSS-Klasse, mit dieser Änderung wird ein Kalender hinzugefügt, der in einem Element vom Typ input angezeigt wird, das zuvor in der Funktion angegeben wurde Javascript.
Die Methode Datumsauswahl () kann auf zwei verschiedene Arten verwendet werden:

 $ (Selektor, Kontext) .datepicker (Optionen) $ (Selektor, Kontext) .datepicker ("Aktion", Parameter) 

Sehen wir uns ein einfaches Beispiel an, wie es funktioniert:

• Wir fügen die Bibliotheken von . hinzu jQuery und das CSS zu unserem Dokument.

• Wir schaffen unsere Funktion in Javascript und wir instanziieren die Methode von Datumsauswahl und Zuweisen des Selektors, in dem es angezeigt wird.

• Und schließlich im HTML wir fügen das hinzu id = Datumsauswahl auf die Eingabe, die darauf hinweist, dass seine Operation, wenn darauf geklickt wird, das CSS ändert und den Kalender anzeigt.

Datum: 

Und das würde in unserem Browser so aussehen:

Hier der komplette Code:

 jQuery UI Datepicker - Standardfunktionalität
Datum:

Sehen wir uns ein fortgeschritteneres Beispiel an, in dem wir mehrere Eigenschaften der Methode verwenden Datumsauswahl mit denen wir Datumsbereiche sowie die Anzahl der anzuzeigenden Kalender validieren.

• 1 - Zuerst binden wir die notwendigen Dateien ein:

• 2 - Wir instanziieren die Methode zweimal für zwei Felder unterschiedlichen Eingabetyps, zu denen wir die Optionen hinzufügen, um zu überprüfen, ob das in das zweite Feld eingegebene Datum nicht größer als das zweite ist, sowie die Anzahl der angezeigten Kalender.

• 3 - Schließlich erstellen wir unseren Input im HTML mit einigen Etiketten, um sie zu identifizieren.

[/einrücken] Von bis 

Sehen wir uns an, wie es in unserem Browser aussehen würde:

Hier hinterlasse ich den vollständigen Code, damit Sie ihn testen und nach Ihren Wünschen ändern können:

 jQuery UI Datepicker - Wählen Sie einen Datumsbereich von bis 

Hat dir dieses Tutorial gefallen und geholfen?Sie können den Autor belohnen, indem Sie diesen Knopf drücken, um ihm einen positiven Punkt zu geben