Maison >interface Web >tutoriel HTML >Comment limiter le nombre de caractères autorisés dans un champ de texte de saisie de formulaire ?

Comment limiter le nombre de caractères autorisés dans un champ de texte de saisie de formulaire ?

王林
王林avant
2023-09-08 14:49:021448parcourir

Comment limiter le nombre de caractères autorisés dans un champ de texte de saisie de formulaire ?

Dans cet article, nous apprendrons comment limiter le nombre de caractères autorisés dans un champ de texte de saisie de formulaire.

Nous utilisons la balise pour obtenir les entrées de l'utilisateur en HTML. Pour donner une limite (ou une plage) à un champ de saisie, nous utilisons les attributs min et max, qui spécifient respectivement les valeurs maximale et minimale du champ de saisie.

Pour définir la limite maximale de caractères dans un champ de saisie, nous utilisons l'attribut maxlength. Cet attribut est utilisé pour spécifier le nombre maximum de caractères pour le champ de saisie .

Pour définir la limite minimale de caractères dans un champ de saisie, nous utilisons l'attribut minlength. Cet attribut permet de préciser le nombre minimum de caractères pour saisir le champ .

Tout d'abord, voyons comment définir la limite maximale de caractères pour un champ de saisie -

Grammaire

Voici la syntaxe permettant de définir la limite maximale de caractères d'un champ de saisie.

<input maxlength="enter_number">

Exemple

Ce qui suit est un exemple de programme pour définir la limite maximale de caractères d'un champ de saisie -

<!DOCTYPE html>
<html>
<head>
   <title></title>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
   <form action = "#">
      Email Id:
      <br>
      <input type = "text" name = "email_id" maxlength = "30" />
      <br>
      Password: <br>
      <input type = "password" name = "password" maxlength = "10" />
      <br>
      <input type = "submit" value ="Submit" />
   </form>
</body>
</html>

Définir une limite minimale de caractères

Voyons maintenant comment définir la limite minimale de caractères pour un champ de saisie

 ;

Grammaire

Voici la syntaxe permettant de définir la limite minimale de caractères d'un champ de saisie en JavaScript -

<input minlength="enter_number">

Exemple

Ce qui suit est un exemple de programme pour définir la limite minimale de caractères d'un champ de saisie en JavaScript -

<!DOCTYPE html>
<html>
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
   <form action="#">
      Username:
      <input type="text" name="username"
      minlength="10"><br><br>
      Password:
      <input type="password" name="password"
      minlength="8"><br><br>
      <input type="submit" value="Submit">
   </form>
</body>
</html>

Utilisez le nombre maximum et minimum de caractères dans les champs de saisie

Voyons maintenant comment utiliser les caractères de limite minimale et les caractères de limite maximale dans les champs de saisie -

Exemple

Voici un exemple de programme pour définir les limites minimales et maximales de caractères d'un champ de saisie en JavaScript -

<!DOCTYPE html>
<html>
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
   <form action="#">
      Username:
      <input type="text" name="username"
      minlength="10" maxlength="20"><br><br>
      Password:
      <input type="password" name="password"
      minlength="8" maxlength="10"><br><br>
      <input type="submit" value="Submit">
   </form>
</body>
</html>

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

Articles Liés

Voir plus