Maison > interface Web > tutoriel HTML > Comment utiliser le type de saisie mois en HTML ?

Comment utiliser le type de saisie mois en HTML ?

PHPz
Libérer: 2023-08-20 20:21:16
avant
974 Les gens l'ont consulté

En HTML, un formulaire comprend divers éléments qui aident à créer une interface utilisateur dans une page Web à l'aide de laquelle nous pouvons collecter différentes natures de la nature.

.

L'un des contrôles couramment utilisés est le contrôle Mois, c'est-à-dire

Ce contrôle fournit essentiellement à l'utilisateur un menu déroulant de type calendrier dans lequel l'utilisateur peut sélectionner ou sélectionner le mois et l'année. Le contrôle Mois permet de sélectionner une date au format AAAA-MM, où AAAA représente l'année et MM représente le mois.

Regardons un exemple simple utilisant le contrôle Mois.

Exemple

<html>
<body>
   <form name="form1">
      <label for="adm">Date of Admission:</label>
      <input type="month" name="doa">
   </form>
</body>
</html>
Copier après la connexion

En exécutant le code donné ci-dessus, un contrôle mensuel sera affiché sur la page.

Lorsque vous cliquez sur l'icône du calendrier sur le côté droit du contrôle, le calendrier mensuel complet s'ouvrira comme ceci −

Comment utiliser le type de saisie mois en HTML ?

Une fois le menu déroulant ouvert, vous pouvez sélectionner le mois et l'année dans le calendrier, ou vous pouvez saisir le mois et l'année dans le contrôle.

Une fois le mois et l'année sélectionnés, ils seront stockés dans une valeur de type String.

Créons un programme pour afficher le mois et l'année sélectionnés à partir du contrôle à l'aide de JavaScript.

Exemple

<html>
<head>
   <title>Admission Form</title>
   <script>
      function display(){
         d=form1.doa.value;
         document.write("<center><b>Date of Admission is "+d 
         +"</b></center>");
      }
   </script>
   <form name="form1">
 	   <label for="adm">Date of Admission:</label>
	   <input type="month" name="doa" onchange="display()">
   </form>
<html>
Copier après la connexion

Dans ce programme, nous avons utilisé la balise

Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal