Maison > interface Web > Questions et réponses frontales > Comment valider le format de date à l'aide de jquery

Comment valider le format de date à l'aide de jquery

PHPz
Libérer: 2023-04-17 13:36:42
original
1521 Les gens l'ont consulté

Dans le développement front-end, nous rencontrons souvent des situations où nous devons vérifier le format de date. jquery est une bibliothèque d'outils très pratique et facile à utiliser, qui peut nous aider à terminer facilement la vérification du format de date. présentez comment utiliser jquery pour vérifier le format de date.

1. Présentez la bibliothèque jquery
Avant d'utiliser jquery pour vérifier le format de date, nous devons d'abord présenter la bibliothèque jquery. Vous pouvez introduire la bibliothèque jquery locale ou l'introduire via CDN :

<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
Copier après la connexion

2. Utilisez des expressions régulières pour vérifier. le format de date
Vérification Le format de date peut utiliser des expressions régulières. jquery fournit une méthode de vérification d'expression régulière $.trim(), qui peut supprimer les caractères invalides tels que les espaces et les nouvelles lignes dans la chaîne. Vous pouvez utiliser les expressions régulières suivantes : $.trim(),可以去掉字符串中的空格以及换行符等无效字符。可以使用如下的正则表达式:

var reg = /^(\d{4})-(\d{2})-(\d{2})$/;
Copier après la connexion

以上正则表达式可以验证形如"2021-05-01"的日期格式,其中d表示数字,{n}表示连续出现n次,^表示匹配字符串的开头,$表示匹配字符串的结尾,()表示分组。
我们可以通过以下代码来使用正则表达式验证日期格式:

var date = $('#date').val();
if ($.trim(date).match(reg) == null) {
    alert("日期格式不正确,请重新输入");
}
Copier après la connexion

上述代码中,#date表示要验证的日期输入框,val()方法可以获取输入框中的值,$.trim()方法去掉空格和换行符等无效字符,match()

var date = $('#date').val();
if (!moment(date).isValid()) {
    alert("日期格式不正确,请重新输入");
}
Copier après la connexion
Les expressions régulières ci-dessus peuvent vérifier le format de date sous la forme "2021-05-01", où d représente un nombre et {n } code> signifie n occurrences consécutives, <code>^ signifie correspondre au début de la chaîne, $ signifie correspondre à la fin de la chaîne et () code> signifie regroupement. <p>Nous pouvons utiliser le code suivant pour vérifier le format de date à l'aide d'expressions régulières : <br>rrreee<br>Dans le code ci-dessus, <code>#date représente la zone de saisie de la date à vérifier, et le val() Méthode Vous pouvez obtenir la valeur dans la zone de saisie. La méthode $.trim() supprime les caractères non valides tels que les espaces et les nouvelles lignes. est utilisé pour faire correspondre des chaînes avec des expressions régulières Match, si la valeur de retour est nulle, cela signifie que le format de date est incorrect.

3. Utilisez le plug-in moment.js pour vérifier le format de date

En plus de la vérification par expression régulière du format de date, vous pouvez également utiliser le plug-in moment.js pour vérifier le format de date. puissant outil de traitement de date qui peut facilement traiter différents formats de date.

Utilisez moment.js pour vérifier le code de format de date comme suit :
rrreee

Dans le code ci-dessus, la méthode moment() convertit la chaîne de date d'entrée en un objet moment, et la méthode isValid() est utilisée pour vérifier si la date est valide. Si la date est illégale, alors renvoie false. 🎜🎜4. Conclusion🎜Cet article présente deux méthodes permettant à jquery de vérifier le format de date : en utilisant des expressions régulières et en utilisant le plug-in moment.js. Quelle que soit la méthode utilisée, vous devez d'abord introduire la bibliothèque jquery ou le plug-in moment.js. La méthode de vérification des expressions régulières est plus simple, mais présente certaines limites. Elle ne convient qu'aux dates dans un format spécifique, tandis que le moment. Le plug-in .js peut gérer davantage de formats de date, mais beaucoup de code est introduit, ce qui a également un certain impact sur les performances de la page. La méthode à utiliser peut être choisie en fonction de la situation réelle. 🎜

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal