recherche

Maison  >  Article  >  interface Web  >  Comment vérifier si une date saisie est égale à la date du jour en utilisant JavaScript ?

Comment vérifier si une date saisie est égale à la date du jour en utilisant JavaScript ?

王林
王林avant
2023-08-26 15:33:121304parcourir

如何使用 JavaScript 检查输入日期是否等于今天的日期？

Dans ce tutoriel, nous apprenons à vérifier si la date saisie est égale à la date du jour ou sans utiliser JavaScript. Parfois, nous devons obtenir la date de l'utilisateur à partir d'un champ de saisie dans différents formats et vérifier si la date saisie et la date du jour correspondent.

Ici, nous allons apprendre deux méthodes pour vérifier si la date saisie est égale à la date d'aujourd'hui.

Comparez respectivement les années, les mois et les jours

Les utilisateurs peuvent obtenir l'année complète, le mois et la date à partir de l'horodatage d'un objet Date en utilisant diverses méthodes telles que getFullYear(), getMonth() et getDate(). De plus, nous pouvons obtenir l'année, le mois et la date en divisant la chaîne saisie par l'utilisateur avec un délimiteur.

Après cela, nous pouvons comparer l'année, le mois et le jour des deux horodatages pour vérifier si la date saisie est égale à la date d'aujourd'hui.

Grammaire

Les utilisateurs peuvent suivre la syntaxe ci-dessous pour déterminer si la date saisie est égale à la date d'aujourd'hui. 

let inputYear = dateInput.value.split("/")[0];
let inputMonth = dateInput.value.split("/")[1];
let inputDate = dateInput.value.split("/")[2];
if (current_date.getFullYear() == inputYear && current_date.getMonth() == inputMonth - 1 && current_date.getDate(); == inputDate) {
   // date is equal to today’s date
} else{
   // date is not equal to today’s date
}

Dans la syntaxe ci-dessus, après avoir divisé la chaîne d'entrée avec "/", nous obtenons un tableau contenant trois valeurs. La première valeur est l’année, la deuxième valeur est le mois et la troisième valeur est le jour.

Algorithme

Les utilisateurs peuvent suivre l'algorithme suivant.

  • Étape 1 - Obtenez la date de l'utilisateur dans un format spécifique.

  • Étape 2 - Divisez la chaîne de date et extrayez l'année, le mois et la date. Ici, nous utilisons la méthode split() de JavaScript pour diviser la chaîne de date.

  • Étape 3 - Utilisez le constructeur new Date() pour créer une date égale à la date du jour.

  • Étape 4 - Extrayez l'année, le mois et la date de la date d'aujourd'hui à l'aide des méthodes getFullYear(), getMonth() et getDate().

    李>

  • Étape 5 - Comparez l'année, le mois et la date de deux horodatages. La méthode getMonth() renvoie le mois compris entre 0 et 11. Nous devons donc comparer le mois avec inputMonth – 1.

  • Étape 6 - Si les trois propriétés des deux dates correspondent, alors la date d'entrée est égale à la date d'aujourd'hui.

Exemple

Dans l'exemple ci-dessous, nous avons créé la fonction compareDate(). Lorsque l'utilisateur appuie sur le bouton Soumettre et saisit une chaîne de date dans le champ de saisie, il appelle la fonction compareDate().

La fonction

compareDate() implémente l'algorithme ci-dessus pour vérifier si la date d'entrée est égale à la date d'aujourd'hui. 

<html>
<body>
   <h3>Comparing the <i>date, month, and year</i> separately to check if input the date is equal to today's date </h3>
   <h4>Enter the date in yyyy/mm/dd format.</h4>
   <input type="text" id="dateInput" />
   <button id = "submit" onclick = "compareDate()"> submit </button>
   <p id = "output"> </p>
   <script>
      let output = document.getElementById("output");
      let dateInput = document.getElementById("dateInput");
      function compareDate() {
         // split the input string
         let inputYear = dateInput.value.split("/")[0];
         let inputMonth = dateInput.value.split("/")[1];
         let inputDate = dateInput.value.split("/")[2];

         let current_date = new Date();
         // get the month, year, and date from the time stamp
         let year = current_date.getFullYear();
         let month = current_date.getMonth();
         let day = current_date.getDate();
         // compare year, month, and date
         if (year == inputYear && month == inputMonth - 1 && day == inputDate) {
            output.innerHTML = "Date is equal to today's date!";
         } else {
            output.innerHTML = "Date is not equal to today's date!";
         }
      }
   </script>
</body>
</html>

Utilisez la méthode toDateString()

Nous pouvons utiliser la méthode toDateString() avec l'horodatage de l'objet Date, qui renvoie uniquement la chaîne de date dans l'horodatage.

Nous pouvons créer un nouvel horodatage de l'objet Date en utilisant n'importe quelle valeur que nous obtenons de l'entrée utilisateur et obtenir la chaîne de date à l'aide de la méthode toDateString(). Ensuite, nous pouvons également créer la date actuelle représentant la date du jour et utiliser la méthode toDateString().

Enfin, nous pouvons comparer les chaînes de date des deux horodatages.

Grammaire

Les utilisateurs peuvent utiliser la méthode toDateString() en suivant la syntaxe suivante pour vérifier si l'entrée est égale à la date du jour. 

let [year, month, date] = dateInput.value.split(",");
let inputDate = new Date(year, month - 1, date);
let current_date = new Date();
if (inputDate.toDateString() == current_date.toDateString()) {
   // it’s today’s date.
} else {
   // It’s not matching with today’s date
}

Dans la syntaxe ci-dessus, nous avons créé un horodatage de la date d'entrée en utilisant l'année, le mois – 1 et la valeur de la date. Puisque l’objet Date a une valeur de mois comprise entre 0 et 11, nous devons fournir le mois – 1.

Exemple

L'exemple suivant obtient une chaîne de date de l'utilisateur dans un champ de saisie de texte dans un format spécifique. Après cela, nous extrayons l'année, le mois et la date de la chaîne et créons une nouvelle date.

Ensuite, nous comparons les chaînes de date des deux horodatages. 

<html>
<body>
   <h3>Using the <i> toDateString() </i> method to check if input the date is equal to today's date </h3>
   <h4>Enter the date in yyyy,mm,dd format.</h4>
   <input type = "text" id = "dateInput" />
   <button id = "submit" onclick = "compareDate()"> submit </button>
   <p id = "output"> </p>
   <script>
      let output = document.getElementById("output");
      let dateInput = document.getElementById("dateInput");
      function compareDate() {
         // extract the year, month, and date
         let [year, month, date] = dateInput.value.split(",");
         let inputDate = new Date(year, month - 1, date);
         let current_date = new Date();
         if (inputDate.toDateString() == current_date.toDateString()) {
            output.innerHTML = "Date is equal to today's date!";
         } else {
            output.innerHTML = "Date is not equal to today's date!";
         }
      }
   </script>
</body>
</html>

Dans le résultat ci-dessus, l'utilisateur peut constater que la saisie d'une date dans un format non valide générera une erreur dans la console.

Les utilisateurs ont appris deux façons de vérifier si une date est égale à la date d'aujourd'hui. Cependant, les utilisateurs peuvent également utiliser la méthode setHours(). Nous pouvons définir l'heure sur 0 dans l'objet date et la comparer avec la date du jour pour vérifier l'égalité.

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!

Déclaration：
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer
Article précédent：Extraire les nombres d'une chaîne à l'aide de JavaScriptArticle suivant：Extraire les nombres d'une chaîne à l'aide de JavaScript

Articles Liés

Voir plus