Comment définir le maxlength dans un textarea ? Et pourquoi maxlength ne fonctionne pas correctement dans textarea ?
Réponses
Trop de publicités?
aqingsao
Points
651
Avant de HTML5, il est très simple mais efficace façon: Tout d'abord définir un attribut maxlength dans le textarea élément:
<textarea maxlength='250' name=''></textarea>
Ensuite, l'utilisation de JavaScript pour limiter les entrées d'utilisateur:
$(function() {
$("textarea[maxlength]").bind('input propertychange', function() {
var maxLength = $(this).attr('maxlength');
if ($(this).val().length > maxLength) {
$(this).val($(this).val().substring(0, maxLength));
}
})
});
Assurez-vous que le liant à la fois "entrée" et "propertychange" événements de le faire fonctionner sur différents navigateurs tels que Firefox/Safari et IE.
Effectivement, c'est pris de mon precedent blog.
Oded
Points
271275
Si vous êtes en utilisant le HTML 5, vous devez le spécifier dans votre DOCTYPE déclaration.
La validité de l'HTML 5, il doit commencer par:
<!DOCTYPE html>
Avant de HTML 5, l' textarea élément n'a pas un maxlength d'attribut.
Vous pouvez les voir dans la DTD/spec:
<!ELEMENT TEXTAREA - - (#PCDATA) -- multi-line text field -->
<!ATTLIST TEXTAREA
%attrs; -- %coreattrs, %i18n, %events --
name CDATA #IMPLIED
rows NUMBER #REQUIRED
cols NUMBER #REQUIRED
disabled (disabled) #IMPLIED -- unavailable in this context --
readonly (readonly) #IMPLIED
tabindex NUMBER #IMPLIED -- position in tabbing order --
accesskey %Character; #IMPLIED -- accessibility key character --
onfocus %Script; #IMPLIED -- the element got the focus --
onblur %Script; #IMPLIED -- the element lost the focus --
onselect %Script; #IMPLIED -- some text was selected --
onchange %Script; #IMPLIED -- the element value was changed --
%reserved; -- reserved for possible future use --
>
Afin de limiter le nombre de caractères tapés en textarea, vous aurez besoin d'utiliser javascript avec l' onChange événement. Vous pouvez alors compter le nombre de caractères et d'interdire la poursuite de la saisie.
Ici est une discussion en profondeur sur la saisie de texte et la façon d'utiliser le serveur et le script côté client pour limiter la taille.
Ici est un autre exemple.
Dss
Points
351
Coxy
Points
5256
Comme je l'ai dit dans un commentaire sur la réponse de aqingsao, cela ne fonctionne pas très bien lorsque textarea comporte des caractères de nouvelle ligne, du moins sous Windows.
J'ai légèrement changé sa réponse ainsi:
$(function() {
$("textarea[maxlength]").bind('input propertychange', function() {
var maxLength = $(this).attr('maxlength');
//I'm guessing JavaScript is treating a newline as one character rather than two so when I try to insert a "max length" string into the database I get an error.
//Detect how many newlines are in the textarea, then be sure to count them twice as part of the length of the input.
var newlines = ($(this).val().match(/\n/g) || []).length
if ($(this).val().length + newlines > maxLength) {
$(this).val($(this).val().substring(0, maxLength - newlines));
}
})
});
Désormais, lorsque j'essaie de coller beaucoup de données dans les nouvelles lignes, je reçois exactement le bon nombre de caractères.
Sony Aja
Points
11
