Limite de caracteres em HTML

95

Como você impõe um limite de caracteres em uma entrada de texto em HTML?

html character-limit

— Iwasakabukiman
fonte

133

Existem 2 soluções principais:

O HTML puro:

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

O JavaScript (anexe-o a um evento onKey):

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

Mas de qualquer maneira, não existe uma boa solução. Você não pode se adaptar à má implementação de HTML de cada cliente, é uma luta impossível de vencer. É por isso que é muito melhor verificar no lado do servidor, com um script PHP / Python / qualquer.

— e-satis
fonte

27

Verifique no servidor como uma verificação final de sanidade, mas adicione aprimoramento do lado do cliente, se puder; torna a experiência do usuário mais rica.

— Rob

43

há um atributo maxlength

<input type="text" name="textboxname" maxlength="100" />

— cruizer
fonte

1

Isso é verdade, mas alguns clientes não verificam isso. Isso é especialmente verdadeiro para clientes que usam telefones celulares.

— Drejc,

Também existem maneiras de removê-los. Por exemplo, o Firefox Web Developer Extension possui uma função Remove Maximum lengths.

— Sam Hasler

Com o Chrome e seu kit de desenvolvedor (que vem com o navegador) é simples remover essas coisas do html

— AntonioCS

12

Além do acima exposto, gostaria de salientar que a validação do lado do cliente (código HTML, javascript, etc.) nunca é suficiente. Verifique também o comprimento do lado do servidor ou simplesmente não verifique (se não for tão importante que as pessoas possam contorná-lo, então também não é importante o suficiente para justificar quaisquer medidas para prevenir isso).

Além disso, companheiros, ele (ou ela) disse HTML, não XHTML. ;)

— Devin Jeanpierre
fonte

concordo. pode-se fazer o POST de dados diretamente em um site usando alguma ferramenta de script, portanto, nesse caso maxlength e outras validações do lado do navegador não são infalíveis

— cruizer

ou use firebug e remova o atributo maxlength.

— Zach,

5

use o atributo "maxlength" como outros já disseram.

se você precisar colocar um comprimento máximo de caracteres em uma ÁREA de texto, será necessário usar o Javascript. Dê uma olhada aqui: Como impor maxlength em textArea em HTML usando JavaScript

— nickf
fonte

verifique este link em StackOverflow: stackoverflow.com/questions/1125482/…

— TlonXP

1

Para o elemento <input>, há o atributo maxlength:

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

(a propósito, o tipo é "texto", não "caixa de texto" como os outros estão escrevendo), no entanto, você deve usar javascript com <textarea> s. De qualquer forma, o comprimento deve ser verificado no servidor de qualquer maneira.

— Pilsetnieks
fonte

0

você pode definir maxlength com jquery que é muito rápido

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

— shekh danishuesn
fonte