<html>
<head>
<title></title>
<script type="text/javascript">
<!-- Debut
// Original: Robert Khatchadourian (sonic890@hotmail.com)
// JavaScript pris sur le site: "http://www.java.scripts-fr.com"
function grandi(max_carac)
{
if( (document.form1.boite.value == null ) || (document.form1.boite.value == "" ) )
document.form1.boite.size = size;
/*
Nous commencons donc par ouvrir notre fonction grandi qui reçoit une variable max_carac.
Une condition if est ouverte pour vérifier si la valeur de notre champ existe avec null ou est vide avec "".
Pour se faire, on utilise la propriété value de l'objet text (ici boite) du formulaire (form1). Vu que notre condition se porte sur deux expression on utilise l'opérateur logique OR (ou en français OU). Cet opérateur fonctionne comme suit :
Si l'une des deux expressions ou les deux ont la valeur true, la valeur du résultat est true. Si les deux expressions ont la valeur false, la valeur du résultat est false.
Lorsque les conditions sont remplies, la taille de notre boite à texte vaut size (variable que nous verrons plus bas).
*/
if( (document.form1.boite.value.length >= size) && (document.form1.boite.value.length <= max_carac) )
document.form1.boite.size = document.form1.boite.value.length + 1;
/*
Arrive la seconde condition if; celle ci vérifie si la valeur du champ texte boite est supérieure ou égale (=>) à notre variable size (plus bas je vous ai dit) et si cette même valeur est inférieure ou égale (<=) à la variable max_carac envoyée à la fonction.
Cette double condition se fait avec l'opérateur logique && (AND, en français ET). Elle fonctionne comme suit :
Si et seulement si les deux expressions ont la valeur true, la valeur du résultat est true. Si l'une des expressions a la valeur false, la valeur du résultat est false.
Si notre condition est remplie on ajoute 1 à la longueur de notre boite en utilisant la propriété length de l'objet String (qui ici représente la valeur de notre boite à texte du formulaire de la page, document.form1.boite.value quoi...).
*/
else document.form1.boite.size = size;
}
/*
Et si aucune des conditions n'est remplies, on donne la valeur de la variable size à la taille de notre boite à texte
*/
// Fin -->
</script>
</head>
<body>
<form name="form1" action="#">
<input type="text" name="boite" maxlength="30" size="5" onChange="setInterval('grandi(document.form1.boite.maxLength)', 1)">
</form>
<!--
Voici donc notre formulaire avec son champ texte, j'ai fixé ici 5 caractères visibles et 30 possibles au maximum.
Sur l'événement onChange, on va utiliser la méthode setInterval de l'objet window; en fait cette méthode nous permet d'appeler notre fonction grandi, en lui envoyant la valeur maxLength (30, qui dans notre fonction correspond à max_car) toutes les 1 millisecondes.
-->
<script type="text/javascript">
<!--
var size = document.form1.boite.size;
// Et voici notre fameuse variable size qui vaut la taille de la boite
// -->
</script>
</body>
</html>
|