Limite de caractères en HTML

95

Comment imposer une limite de caractères sur une saisie de texte en HTML?

html character-limit Iwasakabukiman
la source

Réponses:

133

Il existe 2 solutions principales:

Le pur HTML:

<input type="text" id="Textbox" name="Textbox" maxlength="10" />

Le JavaScript (attachez-le à un événement onKey):

function limitText(limitField, limitNum) {
    if (limitField.value.length > limitNum) {
        limitField.value = limitField.value.substring(0, limitNum);
    } 
}

Mais de toute façon, il n'y a pas de bonne solution. Vous ne pouvez pas vous adapter à la mauvaise implémentation HTML de chaque client, c'est un combat impossible à gagner. C'est pourquoi il est de loin préférable de le vérifier côté serveur, avec un script PHP / Python / n'importe quel script.

e-satis
la source
27
Vérifiez sur le serveur comme une vérification finale de l'intégrité, mais ajoutez une amélioration côté client si vous pouvez le faire; cela permet une expérience utilisateur plus riche.
Rob
43

il y a un attribut maxlength

<input type="text" name="textboxname" maxlength="100" />
cruizer
la source
1
C'est vrai, mais certains clients ne le vérifient pas. Cela est particulièrement vrai pour les clients basés sur la téléphonie mobile.
Drejc le
Il existe également des moyens de les supprimer. Par exemple, l'extension Firefox Web Developer a une fonction Supprimer les longueurs maximales.
Sam Hasler
Avec chrome et son kit de développement (fourni avec le navigateur), il est simple de supprimer de telles choses dans le html
AntonioCS
12

En plus de ce qui précède, je tiens à souligner que la validation côté client (code HTML, javascript, etc.) ne suffit jamais. Vérifiez également la longueur côté serveur, ou ne cochez tout simplement pas du tout (s'il n'est pas si important que les gens puissent être autorisés à le contourner, alors ce n'est pas assez important pour vraiment justifier des mesures pour éviter cela non plus).

Aussi, les camarades, il (ou elle) a dit HTML, pas XHTML. ;)

Devin Jeanpierre
la source
je suis d'accord. on peut POSTER des données directement dans un site Web en utilisant un outil de script, donc dans ce cas, maxlength et d'autres validations côté navigateur ne sont pas infaillibles
cruizer
ou utilisez firebug et supprimez l'attribut maxlength.
Zach le
1

Pour l'élément <input>, il y a l'attribut maxlength:

<input type="text" id="Textbox" name="Textbox" maxlength="10" />

(au fait, le type est "text", pas "textbox" comme d'autres écrivent), cependant, vous devez utiliser javascript avec <textarea> s. Dans tous les cas, la longueur doit être vérifiée sur le serveur de toute façon.

pilsetnieks
la source
0

vous pouvez définir maxlength avec jquery qui est très rapide

jQuery(document).ready(function($){ //fire on DOM ready
 setformfieldsize(jQuery('#comment'), 50, 'charsremain')
})
shekh danishuesn
la source