Dans cet article, nous allons apprendre comment valider une date travers jQuery. Autrement dit, l'utilisateur doit entrer la date dans le format jj /mm /aaaa ou jj-mm-aaaa. Si la date inscrite ne correspond pas avec les deux formats, un message d'erreur sera affiché.
fichier HTML pour "Validation date travers jQuery"
Faisons un fichier HTML qui affiche une forme qui contient l'étiquette, le champ de saisie de texte, un message d'erreur et un bouton de soumission.
Le texte de l'étiquette est réglé sur «Entrez date de naissance» et celle de message d'erreur est réglé sur «Date non valide». Ces quatre points sont également attribués les noms de classe comme «label», «Infobox», «erreur» et de «soumettre», respectivement. Pour ces noms de classes, les sélecteurs de classe respectives sont écrits dans la feuille de style externe.
Le fichier HTML peut apparaître comme indiqué ci-dessous:
Tous les quatre éléments de fichier HTML ci-dessus sont assignés les noms de classe respectives: Label, Infobox, errorand submitso que les propriétés de style définies dans les sélecteurs de classe spécifiées dans le style de feuille de style externe .csscan être appliqué automatiquement à ces articles
Les sélecteurs de classe définie dans le fichier de feuille de style sont indiqués ci-dessous:.
style.css
.label {float: left ; largeur: 150px; }
.infobox {width: 200px; }
.
error {color: red; padding-left: 10px; }
.submit {margin-left: 150px; margin-top: 10px;}
code pour "Validation date travers jQuery"
Le code jQuery pour accepter la date dans le format jj /mm /aaaa ou mm-jj -yyyy est aussi indiqué ci-dessous:.
$ (document) .ready (function () {
$ ('.' erreur ') cacher ();
$ ('. submit ' ) .cliquez (function (event) {
var data = $ ('infobox.') val ();.
Si (validate_date (données))
{
$ ('erreur.') cacher ();.
}
autre
{
$ ('erreur. ') .
montrer ();
event.preventDefault ();
}
});
});
fonction validate_date (date)
{
var pattern = new RegExp (/\\ b \\ d {1,2} [\\ /-] \\ d {1,2} [\\ /- ] \\ d {4} \\ b /);
retour pattern.test (date);
}
Le message d'erreur est rendue invisible au début en dessus de jQuery code. Puis, un événement de clic est attaché à le bouton soumettre. Dans la fonction de gestion des événem