-1

我是 javascript 的新手，我正在尝试制作一个 onclick 下拉菜单。我希望它看起来像这样： http: //www.instantshift.com/demo/dropdown_menu/ 但这是 mouseenter/mouseleave（换句话说，悬停），而我希望它是 onclick。如何更改此代码以使其成为 onclick？您还可以为我提供 onclick 的 jquery 吗？

我当前的悬停代码（mouseenter/mouseleave 菜单）如下： 

$(function(){
$('.dropdown').mouseenter(function(){
    $('.sublinks').stop(false, true).hide();

    var submenu = $(this).parent().next();

    submenu.css({
        position:'absolute',
        top: $(this).offset().top + $(this).height() + 'px',
        left: $(this).offset().left + 'px',
        zIndex:1000
    });

    submenu.stop().slideDown(300);

    submenu.mouseleave(function(){
        $(this).slideUp(300);
    });
});
});
</script>

再一次，我想将其更改为 onclick。

谢谢。

4

2 回答 2

1

我认为您只需单击即可触发菜单，然后任何其他单击都会将其关闭。

所以，简单的修改：

$(function() {
    $('.dropdown').click(function() {
        $('.sublinks').stop(false, true).hide();

        var submenu = $(this).parent().next();

        submenu.css({
            position: 'absolute',
            top: $(this).offset().top + $(this).height() + 'px',
            left: $(this).offset().left + 'px',
            zIndex: 1000
        });

        submenu.stop().slideDown(300);

       //click anywhere outside the menu
       $(document).click(function() {
            var $el = $(this);
            $el.not('.dropdown') && $el.slideUp(300);
        });
    });
});
于 2013-02-08T23:37:12.333 回答
0

代替

$('.dropdown').mouseenter(function(){

和

$('.dropdown').click(function(){
于 2013-02-08T23:34:15.483 回答