jQuery菜单无法点击

Question

I can get get my menu working on hover, but it doesnt work when I use mousedown:

http://codepen.io/anon/pen/Krflq

$(document).ready(function () { 

    $('#nav li').mousedown(
        function () {
            $('ul', this).stop().slideDown(100);

        }, 
        function () {
            //hide its submenu
            $('ul', this).stop().slideUp(100);          
        }
    );

});

Can anyone show me where I have gone wrong please? I want the menu to open up when I click the top-level and stay open.

Answer 1

You can't have two functions in mousedown event so use them separately. mousedown and mouseleave .

Answer 2

Check this :

 $(document).ready(function () {    

$('#nav li').mousedown(
    function () {
        $('ul', this).stop().slideDown(100);

    }

).mouseleave(
 function () {
        $('ul', this).stop().slideUp(100);  
    }
);      
});

Answer 3

I would use click() and slideToggle() . Try this:

$(document).ready(function () { 
    $( "#nav li" ).click(function() {
  $('ul', this).stop().slideToggle(100);
});

});

Also you have to declare your desirable functionallity. All we do is quess now

DEMO

Answer 4

Use Toggle event

$(document).ready(function () { 

    $('#nav li').mousedown(function(){

        $('ul #items').toggle(1000);

    });

});

http://jsfiddle.net/u5brv/

Answer 5

I believe you should use hover instead of mousedown

$('#nav li').hover(
        function () {
            $('ul', this).stop().slideDown(100);

        }, 
        function () {
            //hide its submenu
            $('ul', this).stop().slideUp(100);          
        }
    );

DEMO