Limiter le nombre de caractère dans un textarea - nouvelle version ?
Soyez le premier à donner votre avis sur cette source.
Vue 35 262 fois - Téléchargée 772 fois
Description
Il s'agit en fait de faire ce qui existe déjà mais en rendant le code plus modulaire.
Ici, il suffit de créer son contrôle et de lui affecter une fonction pour gérer la longueur du contenu sur plusieurs évènements
On évite ainsi de répéter tous les évènements intérressants à chaque fois qu'on pose un textarea.
C'est une première version alors si vous avez des remarques pour faire évoluer tout ça, je suis preneur !
Merci !
Ici, il suffit de créer son contrôle et de lui affecter une fonction pour gérer la longueur du contenu sur plusieurs évènements
On évite ainsi de répéter tous les évènements intérressants à chaque fois qu'on pose un textarea.
C'est une première version alors si vous avez des remarques pour faire évoluer tout ça, je suis preneur !
Merci !
Source / Exemple :
<html>
<head>
<title>Limiter un textarea</title>
<style type="text/css">
/* Style pour le textarea */
textarea.limiter
{
width: 610px;
font-size: 10px;
font-family: Verdana, sans-serif;
}
/* style pour le case de décompte de caractères possible à saisir */
div.decompte
{
width: 30px;
position: absolute;
border: 1px solid #FF0000;
font-size: 10px;
font-family: Verdana, sans-serif;
}
</style>
<script language="Javascript" type="text/javascript">
// args : string moncontroletexte, int nbcar, string moncontroledecompte
// return : aucun
// Affecte à certains évènements d'un textarea, le contrôle de la longueur de son contenu
function LimiterTextArea(nom_controletexte, nbcar, nom_controledecompte)
{
var moncontroletexte = document.getElementById(nom_controletexte);
var moncontroledecompte = document.getElementById(nom_controledecompte);
if (moncontroletexte && moncontroledecompte)
{
moncontroletexte.onclick = function(){TextAreaEstRempli(moncontroletexte, nbcar, moncontroledecompte)};
moncontroletexte.onblur = function(){TextAreaEstRempli(moncontroletexte, nbcar, moncontroledecompte)};
moncontroletexte.onkeyup = function(){TextAreaEstRempli(moncontroletexte, nbcar, moncontroledecompte)};
moncontroletexte.onkeypress = function(){TextAreaEstRempli(moncontroletexte, nbcar, moncontroledecompte)};
// *** Affichage du nombre de caractères restant
if(moncontroledecompte.type)
moncontroledecompte.value = NbCarRestant(moncontroletexte, nbcar); // Pour un input de formulaire
else
moncontroledecompte.innerHTML = NbCarRestant(moncontroletexte, nbcar); // Pour un élément HTML
}
}
// TextAreaEstRempli
// args : textarea moncontroletexte, int nbcar, element_HTML moncontroledecompte
// return : bool
// Renvoie vrai si le nombre de caractères maximum du textarea n'est pas atteint
function TextAreaEstRempli(moncontroletexte, nbcar, moncontroledecompte)
{
if (moncontroletexte)
{
if (moncontroletexte.value.length <= nbcar)
{
//alert("pas rempli");
// mes actions ...
// *** Affichage du nombre de caractères restant
if(moncontroledecompte.type)
moncontroledecompte.value = NbCarRestant(moncontroletexte, nbcar);
else
moncontroledecompte.innerHTML = NbCarRestant(moncontroletexte, nbcar);
return true;
}
else
{
//alert("rempli");
// mes actions ...
// Affichage du nombre de caractères restant
moncontroletexte.value = moncontroletexte.value.substr(0, nbcar);
// *** Affichage du nombre de caractères restant
if(moncontroledecompte.type)
moncontroledecompte.value = NbCarRestant(moncontroletexte, nbcar);
else
moncontroledecompte.innerHTML = NbCarRestant(moncontroletexte, nbcar);
return false;
}
}
}
// NbCarRestant
// args : textarea moncontroletexte, int nbcar
// return : int
// Renvoie le nombre de caractère à saisir
function NbCarRestant(moncontroletexte, nbcar)
{
if (moncontroletexte.value.length)
return new Number(nbcar - moncontroletexte.value.length);
else
return new Number(nbcar);
}
</script>
</head>
<body>
<form name="frmPage" action="Limiter.htm" method="POST">
<textarea id="commentaire" name="commentaire" class="limiter"></textarea>
<!-- Avec un INPUT de formulaire -->
<!--<input type="text" id="controle_decompte" name="controle_decompte" value="">-->
<!-- Ou avec un DIV -->
<div id="controle_decompte" name="controle_decompte" class="decompte"></div>
<script language="Javascript" type="text/javascript">
LimiterTextArea('commentaire', 10, 'controle_decompte');
</script>
<input type="reset" id="annuler" name="annuler" value="Annuler" />
</form>
</body>
</html>
Codes Sources
A voir également
- Limiter le nombre de caractère dans un textarea - nouvelle version ?
- Limiter le nombre de caractère dans une ligne d'un textarea!!! (Résolu) » Forum - PHP
- Limiter le nombre de caractère par ligne dans un fichier de sous tires (.srt) » Codes sources - Java (Multimedia)
- Limiter le nombre de caractère fonction php (Résolu) » Forum - PHP
- Limiter un nombre de caractere dans un jTextArea » Forum - Java
- Limiter la saisie à un nombre de caractere » Forum - C
Commentaires
Vous n'êtes pas encore membre ?
inscrivez-vous, c'est gratuit et ça prend moins d'une minute !
Les membres obtiennent plus de réponses que les utilisateurs anonymes.
Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.
Le fait d'être membre vous permet d'avoir des options supplémentaires.