Action lors de la modification d’un champ : change(function)

Catégorie : Javascript | Tag : , ,
Share

En ce moment, je fais quelques tests avec jQuery histoire d’améliorer un petit peu mon niveau dans ce framework avec lequel j’ai déjà bidouillé quelques fois. Aujourd’hui, j’ai simplement cherché à effectuer une action lorsqu’un utilisateur modifie la valeur d’un champ. Pour cela, il suffit d’utiliser la méthode @@change(function)@@ de [jQuery|tag:jQuery] sur le champ en question. Voyons un exemple. D’abord le code HTML : ///

Élévation au carré


/// Et le code Javascript : /// $(document).ready(function() { // — Au chargement de la page, calcul avec la valeur par défaut // On récupère la valeur du champ, au passage on enlève les espaces éventuels avant et après nbElement = $(‘#nbElement’).val().trim(); // Si c’est un nombre if (!isNaN(nbElement)) { // On affiche le résultat dans la balise ayant l’id « max » $(‘#max’).html(nbElement*nbElement+’='+nbElement+’x'+nbElement); } // — Lorsqu’un utilisateur change la valeur du champ $(‘#nbElement’).change(function() { nbElement = $(‘#nbElement’).val().trim(); if (!isNaN(nbElement)) $(‘#max’).html(nbElement*nbElement+’='+nbElement+’x'+nbElement); }); }); /// __[Tester ce code|/public/Jquery/change]__ J’ai mis longtemps à chercher une manière de tester si la valeur récupéré était un nombre en [jQuery|tag:jQuery], mais visiblement, il faut utiliser la fonction native de [Javascript|tag:Javascript].

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

*

Vous pouvez utiliser ces balises et attributs HTML : <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>