[XHTML] limiter le nombre de caractere d'un textarea

par **abricot** » 12 janv. 2007, 12:56

D'ac, je vais tester ca tout à l'heure et je te dis!

par **Cyrano** » 11 janv. 2007, 14:46

Je viens de le tester aussi bien sur IE7 que sur Firefox 2 : ça fonctionne toujours...

Juste un détail : si tu quittes la zone de saisie et que tu veux y revenir pour corriger une faute par exemple...... ça vide la zone.

Solution : mets une valeur par défaut : dans le "onfocus", teste la valeur contenue dans la zone, si elle est égale à la valeur par défaut, tu vide, sinon, tu ne modifie rien.

par **abricot** » 11 janv. 2007, 13:45

Coucou,

Oui JS est bien activé, je suis sous internet explorer 7.
Voici le code tel que je l'ai recopié :

Code : Tout sélectionner

<html>
<head>
<title></title>
<script type="text/javascript"> 
/* <![CDATA[ */ 
function limite(zone) 
{ 
    var max = 500; 
    if(zone.value.length >= max) 
    { 
        zone.value = zone.value.substring(0,max); 
    } 
    var reste = max - zone.value.length; 
    var affichage_reste = '<font face="comic sans ms" size="2">Limite : 500. Il vous reste '+ reste +' caractères.</font>'; 
    document.getElementById('max_desc').innerHTML = affichage_reste; 
} 
/* ]]> */ 
</script>
</head>
<body>

<textarea name="message" cols="110" rows="11" style="font-family: comic sans ms; font-size: 10pt" onfocus="this.value='';" onkeyup="limite(this);" onkeydown="limite(this);"></textarea>
<br>
<span id="max_desc"></span>
</body>
</html>

Voila, dites moi si vous reperez une erreur

Edit ; j'ai rajouté les balises html pour pas que ca prete à confusion

par **BeRoots** » 10 janv. 2007, 18:56

si il y a un problème quelque part c'est pas dans ce code car je l'utilise depuis deja pas mal de temps et il fonctionne à merveille

le mieux serai de nous faire voir ton code complet...

question bonus: a tu essayé avec un autre navigateur? est ce que js est bien activer pour le navigateur?

par **abricot** » 10 janv. 2007, 18:07

Coucou Cyrano,

J'ai recopié ton code en fait, celui que tu as donné au dessus!

par **Cyrano** » 09 janv. 2007, 18:25

Sans voir ton code, impossible de voir où est l'erreur.

par **abricot** » 09 janv. 2007, 16:12

Salut,

J'ai un problème avec ce code. Je connais pas du tout le JS et je trouve completement idiot qu'on ne puisse pas limiter un

Code : Tout sélectionner

<textarea>

!
Je vous explique mon problème :

Lorsque je tape quelque chose dans le textarea, que je clique sur un autre champ et que je reclique dans le textarea tout disparait!
J'ai crus que c'étais à cause du

Code : Tout sélectionner

onfocus="this.value='';"

alors je l'ai viré pour tester mais ce n'est pas ca :/ Je capte pas, c'est trop bisar le JS! Encore pire que le php, lol

par **BeRoots** » 05 mai 2006, 18:54

ooops oui la honte

je l'avait deja fait en plus

ce qui est bizard c'est que IE à quand même reconnu qu'il y avait du JS sur ma page

enfin bref...

encore merci Cyrano

par **Cyrano** » 05 mai 2006, 18:26

Non, on utilise <link> pour du CSS, mais pour un JavaScript, on fait:

Code : Tout sélectionner

<script type="text/javascript" src="./mes_scripts/mon_fichier.js"></script>

par **BeRoots** » 05 mai 2006, 18:20

me revoila dans ce vieux sujet car j'ai de nouveau un soucis

j'ai voulu externaliser le js de cyrano mais il ne fonctionne alors plus

j'ai fait comme ceci pour le remplacer dans <head>:

Code : Tout sélectionner

<link href="js/limite_txt.js" type="text/javascript" />

ça doit venir du innerHTML car mon url vers le js est correct...

si quelqu'un a une idée

par **BeRoots** » 04 avr. 2006, 11:58

ok, merci

sinon j'avait fait ceci et çà marchai aussi

<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Limite le nombre de caractères d'un textarea</title>
<script type="text/javascript">
/* <![CDATA[ */
function limite(zone)
{
    var max = 20;
    if(zone.value.length >= max)
    {
        zone.value = zone.value.substring(0,max);
    }
    var reste = max - zone.value.length;
    document.getElementById('max_desc').innerHTML = reste;
}
/* ]]> */
</script>
</head><body>
<form name="menu1">
  <textarea name="zone2Text" cols="40" rows="10"  onfocus="this.value='';" onkeyup="limite(this);" onkeydown="limite(this);">Votre texte ici.</textarea><br />
  <p>vous pouvez encore inscrire <span id="max_desc">20</span> caractères</p>
</form>
</body>
</html>

encore merci à toi cyrano

je met résolu

par **Cyrano** » 04 avr. 2006, 11:46

"onload" ne peut être utilisé que dans la balise <body>.

Mets un texte directement entre les balises <span>, il sera remplacé par la fonction lorsque tu commenceras à envoyer du texte dans le textarea.

par **BeRoots** » 04 avr. 2006, 11:37

bon, tous fonctionne à meirveille ma j'aimerai regler un dernier detail:

au chargement de la page, j'aimerai faire en sorte que le span affiche le message avec la valeur max

j'ai bien essayer de rajouter ceci au textarea mais sans succes

Code : Tout sélectionner

onLoad="limite(this);"

comment puis-je faire?

par **BeRoots** » 04 avr. 2006, 11:13

Merci cyrano

je vais tester et je vous tient au courant

par **Cyrano** » 04 avr. 2006, 08:06

C'est effectivement possible, mais avec du Javascript : exemple:

<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Limite le nombre de caractères d'un textarea</title>
<script type="text/javascript">
/* <![CDATA[ */
function limite(zone)
{
    var max = 20;
    if(zone.value.length >= max)
    {
        zone.value = zone.value.substring(0,max);
    }
    var reste = max - zone.value.length;
    var affichage_reste = 'Vous pouvez encore inscrire '+ reste +' caractères';
    document.getElementById('max_desc').innerHTML = affichage_reste;
}
/* ]]> */
</script>
</head><body>
<form name="menu1">
  <textarea name="zone2Text" cols="40" rows="10" onfocus="this.value='';" onkeyup="limite(this);" onkeydown="limite(this);">Votre texte ici.</textarea><br />
  <span id="max_desc"></span>
</form>
</body>
</html>

La page est complète en soi, teste-là et inspire toi pour faire ton propre code

[XHTML] limiter le nombre de caractere d'un textarea

Répondre

Étendre la vue Revue du sujet : [XHTML] limiter le nombre de caractere d'un textarea