Mostrare e nascondere un menu sul pulsante di scatto, e nasconderlo con gli scatti di fuori

Question

Ho il seguente codice che ha solo i controlli relativi a un elemento.

<ul class="controls">
    <li><button type="button" class="button1" value="somevalue">&nbsp;</button></li>
    <li><button type="button" class="optionsbutton" value="somevalue">&nbsp;</button></li>
    <li class="options">
        <ul>
            <li>Option 1 link</li>
            <li>Option 2 link</li>
            <li>Option 3 link</li>
       </ul>
    </li>
</ul>

Il menu delle opzioni (l'ul nei li.options) è nascosta per impostazione predefinita nel css (tramite display: none). Voglio un click sul pulsante Opzioni (button.optionsbutton) per alternare visualizzare o nascondere l'ul, ma voglio anche un clic su qualsiasi altro tasto opzioni (ci sono molti elementi con questo tasto) per chiudere tutti i menu aperti e ho bisogno di un clicca non ovunque su un pulsante per chiudere il menu. Il mio codice jQuery è qui sotto:

$('button.optionsbutton').click(
    function(event){
        // hiding any other open menus
        $('ul.controls li.options').hide();

        var OptionMenu = $(this).parent('li').siblings('.options');
        if ( OptionMenu.is(':visible') ) {
            $('ul.bit_controls li.bit_options').hide();
        } else {
            bitOptionMenu.css('display','block'); 
            //because show() sets display to list-item insteads of block
        } 

        event.stopPropagation();
    }
);

// So that clicks anywhere outside will close the menu
$('html').click(
    function(event){
        if(event.target != 'button.options' && $('button.options').is(':visible') ) {
            $('ul.controls li.options').hide();
        }
    }
);

I menu aperti correttamente quando i pulsanti vengono cliccati e chiudere quando un altro fa clic sul pulsante o c'è uno scatto di fuori del menu. MA, cliccando sullo stesso tasto due volte non chiude il menu! Cosa è l'affare, ragazzi, so che la sua facile, ma ho battendo la testa contro per ore.

Answer 1

La $('ul.controls li.options').hide(); linea sarà probabilmente nascondere il menu.

Se questo è il caso, il test di if ( OptionMenu.is(':visible') ) restituisce sempre falso e mostrare il menu.