31 août 2007
Gérer l’état des champs textes
Article publié dans la catégorie javascript | lu 1344 fois |
Voici la V1 de la classe javascript CustumInput.
Cette classe est permet de modifier le comportement de champs texte a partir de leur classe.
Elle permet de définir une classe Css pour l’état focus et pour l’état blur du champ texte.
Elle vérifie également si la valeur du champs texte a été initialisé et si elle n’est pas vide.
fonctionnalités de la Classe CustumInput:
- implémente un style CSS a l’état blur du champ texte
- implemente un style CSS a l’état focus du champ texte
- vérifie si le contenu du champ texte a été initialisé et sinon, met la valeur initiale au champ texte.
La Classe CustumInput s’utilise tres simplement:
1- dans un fichier css, créer les 2 classes Css appliqués au champ texte a l’état focus et blur
[css]
.styleBlur {
color:#515151;
border:1px solid #515151;
background-color:#F1F1F1;
}
.styleFocus {
color:red;
border:1px solid red;
background-color:#FFFFFF;
}
[/css]
2- Attacher le fichier javascript dans le head de la page
[javascript]
;
[/javascript]
3- appliquer une classe aux champs textes que l’on souhaite “custumiser”
[javascript]
4- paramétrer l’objet custumInput
[javascript]
var MC_Input = new Custum_Input(”custumInput”,”styleBlur”,”styleFocus”);
[/javascript]
Télécharger les sources de custumInput