Maison >interface Web >tutoriel HTML >Comment utiliser le type de saisie email en HTML ?
Comment utiliser le type de saisie email en HTML ?
- WBOYavant
- 2023-09-05 13:52:30934parcourir
L'e-mail est un outil sur Internet où nous pouvons envoyer des e-mails formels à d'autres personnes en utilisant des adresses e-mail. Il existe de nombreux fournisseurs de services de messagerie comme Yahoo, Gmail, Hotmail, etc. Nous devons nous inscrire auprès de ces prestataires de services afin de recevoir une adresse e-mail de notre choix. Une adresse e-mail se compose de deux parties : un nom d'utilisateur et un nom de domaine. Les noms d’utilisateur peuvent être composés de lettres majuscules ou minuscules, de chiffres, de caractères spéciaux et de points. La longueur maximale d'un nom d'utilisateur est de 64 caractères et la longueur maximale d'un nom de domaine est de 253 caractères. Le nom d'utilisateur et le nom de domaine sont toujours séparés par le symbole "@". Nous saisissons les identifiants de messagerie à de nombreux endroits et vous devez avoir remarqué que la page Web accepte toujours des adresses valides.
Dans le formulaire HTML, nous créons un contrôle de saisie sur une seule ligne de type « email ». Une fois typemail utilisé, il vérifie automatiquement la validité de l’adresse e-mail. La validation de l’adresse email est en effet très importante, sinon l’utilisateur risque également de saisir une mauvaise adresse email. Bien qu'il ne vérifie pas l'intégralité de l'adresse e-mail, il vérifie uniquement les extensions @ et TLD, qui sont les domaines de premier niveau.
Voyons comment utiliser le courrier électronique en HTML.
Exemple
<html>
<body>
<form name="form1">
<label for="sub">Enter your e-mail id : </label>
<input type="email">
<br><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
Dans cette application, si l'utilisateur ne saisit pas le bon format d'adresse e-mail, un message d'erreur s'affichera.
Nous pouvons également faire en sorte que notre contrôle de messagerie accepte plusieurs adresses e-mail. Par exemple, lorsque nous rédigeons un e-mail, nous pouvons saisir plusieurs adresses dans les champs À, Cc et Cci. Ainsi, si vous souhaitez également effectuer un contrôle permettant de saisir plusieurs adresses e-mail, vous pouvez utiliser la propriété MULTIPLE.
Exemple
Regardons un exemple pour clarifier ce concept.
<html>
<body>
<form name="form1">
<table>
<tr>
<td>
<label for="to">To </label>
</td>
<td>
<input type="email" multiple>
</td>
</tr>
<tr>
<td>
<label for="cc">Cc </label>
</td>
<td>
<input type="email" multiple>
</td>
</tr>
<tr>
<td>
<label for="bcc">Bcc </label>
</td>
<td>
<input type="email" multiple>
</td>
</tr>
<tr>
<td></td><td>
<textarea rows="10" cols="50">
</textarea></td>
</tr>
<tr>
<td></td>
<td>
<input type="submit" value="Submit"></td>
</tr>
</table>
</form>
</body>
</html>
Dans le champ "À" ou "Cc" ou "Cci", nous pouvons saisir les adresses e-mail de plusieurs destinataires à l'aide d'une virgule (,)
Supposons que sur votre site Web, vous souhaitiez définir une limite sur le nombre de caractères dans une adresse e-mail, vous pouvez alors utiliser les attributs MINLENGTH et MAXLENGTH dans la balise MINLENGTH spécifiera le nombre minimum de caractères qu'une adresse e-mail peut accepter, tandis que MAXLENGTH limitera le nombre maximum de caractères dans une adresse e-mail.
Exemple
<html>
<body>
<form name="form1">
<label for="sub">Enter your e-mail id : </label>
<input type="email" minlength="15" maxlength="25">
<br><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
Le contenu saisi ne peut pas dépasser la limite. Une fois la limite dépassée, le curseur cessera de taper.
Pour définir la valeur par défaut du contrôle de messagerie, cela signifie que l'ID de messagerie par défaut apparaîtra dans le champ de texte de l'e-mail (en utilisant la propriété VALEUR) au lieu d'un champ de texte vide. Vous pouvez également en faire un champ obligatoire à l'aide de l'attribut REQUIRED.
Exemple
<html>
<body>
<form name="form1">
<label for="sub">Enter your e-mail id : </label>
<input type="email" value="abc@gmail.com" required>
<br><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
Si laissé vide, une erreur sera affichée.
Supposons que, sur un site Web, le format dans lequel l'adresse e-mail peut être saisie doive être affiché afin que l'utilisateur puisse facilement la saisir dans le format correct. A cet effet, des espaces réservés peuvent être créés.
Exemple
<html>
<body>
<form name="form1">
<label for="sub">Enter your e-mail id : </label>
<input type="email" placeholder="abc@gmail.com">
<br><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
Enfin, parlons de l'attribut pattern, grâce auquel nous pouvons limiter la saisie aux seules adresses e-mail d'un domaine spécifique. Il n'acceptera pas les adresses e-mail d'autres domaines.
Exemple
<html>
<body>
<form name="form1">
<label for="sub">Enter your e-mail id : </label>
<input type="email" pattern=".+@gmail\.com"><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
Selon cette application, seules les adresses Gmail sont autorisées.
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!