JQuery : boucle for

Version imprimable

JQuery : boucle for

Bonjour,

J'ai une fonction qui me sert à afficher ou cacher des div selon qu'une case est cochée ou non.
Afin d'éviter de recopier plusieurs fois cette fonction j'ai voulu mettre les noms des sélecteurs dans un tableau, et "générer" ainsi mes fonctions.

Le fait de cocher et décocher les cases fonctionne mais celà affiche à chaque fois la dernière div et pas la div correspondant à la case.
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 var tab_checkbox = [45, 47, 48, 49]; var id = ""; for (var i = 0; i<tab_checkbox.length; i++) { id = "checkbox" + tab_checkbox[i] + "botanique"; $("input[name='"+id+"[1]']").change( function() { if($(this).is(':checked')) { $("div[id='"+id+"']").show(); } else { $("div[id='"+id+"']").hide(); } }); }
Merci pour vos éclaircissements.

perso je passerais par un $.each

mais le souci vient de l'attribution dans la boucle
je te conseille de passer par le data

Code:

1
2
3
4
5
6
7
8
9
10
11
12
var tab_checkbox = [45, 47, 48, 49];
var id = "";
for (var i = 0; i<tab_checkbox.length; i++) {
    id = "checkbox" + tab_checkbox[i] + "botanique";
    $("input[name='"+id+"[1]']").change( function() {
        $(thid).data("idx",id)
        if($(this).is(':checked')) {
            $("div[id='"+$(this).data('idx')+"']").show();
        } else {
            $("div[id='"+$(this).data('idx')+"']").hide();
        } 
    });

}

14/05/2012, 17h40
lescaph

Merci pour cette réponse rapide.
Je n'ai pas eu plus de succès avec l'utilisation de data. Les checkboxs 45, 47, 48 et 49 affichent toutes la div 49.

Je vais essayer de voir du côté de .each
14/05/2012, 18h20
SpaceFrog

peut on voir le html associé ?

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
 
    var tab_checkbox = [45, 47, 48, 49],
        id = "";
 
    for (var i = 0; i<tab_checkbox.length; i++) {
        id = "checkbox" + tab_checkbox[i] + "botanique";
        $("input[name='"+id+"[1]']").change( function(id) {
            return function() {
                $(this).data("idx",id);
                if($(this).is(':checked')) {
                    $("div[id='"+$(this).data('idx')+"']").show();
                } else {
                    $("div[id='"+$(this).data('idx')+"']").hide();
                }
            }
        }(id));
    }

14/05/2012, 19h56
SpaceFrog

Code:

$("div[id='"+$(this).data('idx')+"']").show();

peut se résumer à

Code:

$("#"+$(this).data('idx')).show();
15/05/2012, 10h28
lescaph

C'est tout bon ! La dernière proposition me donne le comportement attendu. Mes checkboxs affichent bien les divs correspondantes.

Merci Macmillenium et SpaceFrog pour les solutions et optimisations proposées.