web-dev-qa-db-fra.com

Limiter le nombre de caractères autorisés dans le champ de saisie de formulaire

Comment puis-je limiter ou empêcher l'utilisateur de ne saisir qu'un maximum de cinq caractères dans la zone de texte?

Ci-dessous le champ de saisie dans mon formulaire:

<input type="text" id="sessionNo" name="sessionNum" />

Utilisez-vous quelque chose comme maxSize ou quelque chose comme ça?

108
BruceyBandit

longueur maximale :

Le nombre maximum de caractères qui seront acceptés en entrée. Cela peut être supérieur à celui spécifié par SIZE, auquel cas le champ défilera de manière appropriée. La valeur par défaut est illimitée.

<input type="text" maxlength="2" id="sessionNo" name="sessionNum" onkeypress="return isNumberKey(event)" />

Cependant, cela peut être affecté ou non par votre gestionnaire. Vous devrez peut-être également utiliser ou ajouter une autre fonction de gestionnaire pour tester la longueur.

165
Jared Farrish

Le moyen le plus simple de le faire:

maxlength="5"

Donc .. Ajouter cet attribut à votre contrôle:

<input type="text" 
    id="sessionNo" 
    name="sessionNum" 
    onkeypress="return isNumberKey(event)" 
    maxlength="5" />
27
Nonym

Ajoutez les éléments suivants à l'en-tête:

<script language="javascript" type="text/javascript">
function limitText(limitField, limitNum) {
    if (limitField.value.length > limitNum) {
        limitField.value = limitField.value.substring(0, limitNum);
    }
}
</script>

    <input type="text" id="sessionNo" name="sessionNum" onKeyDown="limitText(this,5);" 
onKeyUp="limitText(this,5);"" />
8
b3verelabs

Selon w3c , la valeur par défaut de l'attribut MAXLENGTH est un nombre illimité. Donc, si vous ne spécifiez pas le maximum, un utilisateur peut copier et coller la bible à plusieurs reprises et la coller dans votre formulaire.

Même si vous spécifiez un nombre raisonnable pour MAXLENGTH, assurez-vous de vérifier la longueur des données soumises sur le serveur avant le traitement (en utilisant quelque chose comme php ou asp) car il est assez facile de contourner la restriction de base MAXLENGTH.

7
Mahdi Jazini

Simplifier

      <input type="text" maxlength="3" />

et utilisez une alerte pour indiquer que le nombre maximal de caractères a été utilisé.

3
user5829707

Je le fais toujours comme ça:

$(document).ready(function(){
var maxChars = $("#sessionNum");
var max_length = maxChars.attr('maxlength');
if (max_length > 0) {
    maxChars.bind('keyup', function(e){
        length = new Number(maxChars.val().length);
        counter = max_length-length;
        $("#sessionNum_counter").text(counter);
    });
}
});

Contribution:

<input name="sessionNum" id="sessionNum" maxlength="5" type="text">
Number of chars: <span id="sessionNum_counter">5</span>
3
Sašo Krajnc

Longueur maximale

Le nombre maximum de caractères qui seront acceptés en entrée. L'attribut maxlength spécifie le nombre maximum de caractères autorisés dans l'élément.

écoles Maxlength W

  <form action="/action_page.php">
     Username: <input type="text" name="usrname" maxlength="5"><br>
     <input type="submit" value="Submit">
   </form>
2
Kondal
<input type="text" maxlength="5">

le nombre maximum de lettres pouvant être entrées est 5.

2
anonymous
<input type="number" id="xxx" name="xxx" oninput="maxLengthCheck(this)" maxlength="10">

function maxLengthCheck(object) {
  if (object.value.length > object.maxLength)
  object.value = object.value.slice(0, object.maxLength)
}
1
P.Banerjee

Vous pouvez utiliser <input type = "text" maxlength="9"> ou

<input type = "number" maxlength="9"> pour les nombres ou <input type = "email" maxlength="9"> pour la validation du courrier électronique s'affichera

1
BKas Development