Menu déroulant et event

Version imprimable

Bonjour,
J'ai réussi à faire un genre de menu déroulant sur le click d'un bouton.
Le menu déroulant est supprimé lorsqu'il perd le focus et lorsqu'il re-clique sur ce bouton.
Le problème vient lorsque je clique sur le bouton pour fermer ce menu déroulant : il supprime bien le menu déroulant mais se ré ouvre dessuite.C'est normal, l'ouverture du menu est conditionné à l event click.
Donc j 'ai pensé à supprimer son event lorsque j'ouvre le menu et à le réactiver à sa fermeture.Mais si je fais cela sans passer par un timeout , le menu déourlant se réouvre si je veux le fermer.

Pensez vous à une meilleur solution que celle proposée ci-dessous ?
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 function OpenPopupSelection(elt) { if(elt.attr("expanded") == "false") { elt.focus(); elt.attr("expanded","true") elt[0].onclick= function(){}; elt.addClass("headerSelectionClick"); elt.blur(function(){ClosePopupSelection($(this));}); var build="<div class=\"popupHeaderSelection\"><a>Tous</a><a>Aucun</a><a>Dernière position</a></div>"; elt.append(build); } } function ClosePopupSelection(elt) { setTimeout(function(){elt[0].onclick=function(){ C($(this)); };},300); elt.unbind("blur"); elt.attr("expanded","false"); elt.removeClass("headerSelectionClick"); elt.find("div").remove(); }

21/03/2011, 10h55
danielhagnoul

Bonjour

Votre message me fait penser à "Problème : ma fonction hover() provoque un va-et-vient !".

Mais comment voulez-vous que l'on vous aide avec cet extrait de code, c'est comme si vous me demandiez de résoudre un puzzle avec le tiers du jeu !

Code html :

Code:

1
2
 
<a href=\"javascript:void(0);\" onclick=\"OpenPopupSelection($(this));\">Option</a>"

Code javascript :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
 
function OpenPopupSelection(elt)
        {
            if(elt.attr("expanded") == "false")
            {
                elt.focus();
                elt.attr("expanded","true")
                elt[0].onclick= function(){};
                elt.addClass("headerSelectionClick");
                elt.blur(function(){ClosePopupSelection($(this));});
                var build="<div class=\"popupHeaderSelection\"><a>Tous</a><a>Aucun</a><a>Dernière position</a></div>";
                elt.append(build);
            }
        }
 
        function ClosePopupSelection(elt)
        {
            setTimeout(function(){elt[0].onclick=function(){ C($(this)); };},300);
 
            elt.unbind("blur");
            elt.attr("expanded","false");
            elt.removeClass("headerSelectionClick");
            elt.find("div").remove();
        }

Mon problème est de savoir s'il n' y a pas une meilleure solution d'écrire la fonction ClosePopupSelection(elt) et plus particulièrement la ligne qui correspond au settimeout(...) afin d'éviter d'appeler la fonction OpenPopupSelection(elt) lorsque je clique sur le lien "Option" pour justement fermer la popup?