Heim > Web-Frontend > HTML-Tutorial > Wie verwende ich den Monatseingabetyp in HTML?

Wie verwende ich den Monatseingabetyp in HTML?

PHPz
Freigeben: 2023-08-20 20:21:16
nach vorne
948 Leute haben es durchsucht

In HTML besteht ein Formular aus verschiedenen Elementen, die bei der Erstellung einer Benutzeroberfläche auf einer Webseite helfen, mit der wir verschiedene Naturelemente erfassen können.

Eines der am häufigsten verwendeten Steuerelemente ist das Monat-Steuerelement, d. h.

Dieses Steuerelement stellt dem Benutzer grundsätzlich ein kalenderähnliches Dropdown-Menü zur Verfügung, aus dem der Benutzer den Monat und das Jahr auswählen oder auswählen kann. Mit dem Steuerelement „Monat“ können Sie ein Datum im Format JJJJ-MM auswählen, wobei JJJJ für das Jahr und MM für den Monat steht. Sehen wir uns ein einfaches Beispiel mit dem

Month

-Steuerelement an. Beispiel

<html>
<body>
   <form name="form1">
      <label for="adm">Date of Admission:</label>
      <input type="month" name="doa">
   </form>
</body>
</html>
Nach dem Login kopieren

Wenn Sie den oben angegebenen Code ausführen, wird auf der Seite eine Monatskontrolle angezeigt.

Wenn Sie auf das Kalendersymbol auf der rechten Seite des Steuerelements klicken, wird der vollständige Monatskalender wie folgt geöffnet: −

Wie verwende ich den Monatseingabetyp in HTML?

Sobald sich das Dropdown-Menü öffnet, können Sie den Monat und das Jahr aus dem Kalender auswählen oder den Monat und das Jahr im Steuerelement eingeben.

Sobald der Monat und das Jahr ausgewählt sind, werden sie als Wert vom Typ „String“ gespeichert.

Lassen Sie uns ein Programm erstellen, um mithilfe von JavaScript den ausgewählten Monat und das ausgewählte Jahr aus dem Steuerelement anzuzeigen.

Beispiel

<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>
Nach dem Login kopieren

In diesem Programm haben wir das Tag

Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage