Bonjour à tous, je n'arrive pas à résoudre un problème et je demande donc de l'aide de la part de communauté.

Voici mon problème je cherche à cliquer sur des liens ayant comme id=".A-playlist-i" avec i variant de 1 à n qui m'affiche le contenu associé à cette playlist qui a pour id="S-section-i" (A car cela est contenu dans un aside et S car c'est contenu dans une section).

Dans un premier temps j'ai donc créer une liste Li qui parcourt mon "aside" et ma "section" et qui me donne toutes les playlists existantes.

Dans un second temps j'utilise l'évenement clique; quand je clique sur n'importe quelle playlist je veux qu'il affiche le contenu correspondant dans la section. Par exemple si je clique sur playlist 1 (id="A-section-2") il cache toutes les playlists "S-section-k" avec k=!i et m'affiche uniquement "S-section-2" (cad k==i).

Cependant lorsque le programme s’exécute et que je clique sur un lien, il parcourt toute la boucle for (k variant de 1 à n) sans executer le script. du coup k=n+1 et le contenu de la section est logiquement inchangé.

Comment puis je faire pour que la fonction s'éxécute dans la boucle?

Merci infiniment de votre coopération!

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
 
<script>
 
    var Li=function(){
        var size=document.querySelectorAll('aside .A-playlist').length;
 
 
        var L=new Array();
        var M=new Array();
        for (var i = 0; i < size; i++) {
             var A_nom_playlist=document.querySelectorAll('aside .A-playlist')[i].id;
             var S_nom_playlist=document.querySelectorAll('section .S-playlist')[i].id;
             L=L.concat('#'+A_nom_playlist);
             M=M.concat('#'+S_nom_playlist);
 
 
        };
        return([L,M]);
 
    };
 
 
    var L=Li()[0];
    var M=Li()[1];
 
        var taille=L.length;
    for(var j=0;j<taille;j++){
        $(L[j]).click(function(){
            for(var k=0;k<taille;k++){
                if(k==j){
                    $(M[k]).show();
 
                }
                else{
                    $(M[k]).hide();
                }
 
            }
 
 
 
        });
    }
 
 
 
 
 
</script>