点击下拉导航菜单 [英] On-click drop-down nav menu

问题描述

我使用一些下拉菜单创建列列表，我需要为下拉列表中的Jquery使其工作。

I am making a column list with some drop-down menus and I needed the Jquery for the drop-down to make it work.

我发现一些Jquery对于这个，但问题是当你有两个菜单与ul和li，像这样。
HTML：

I have found some Jquery for this but the problem is when you have two menus with ul and li, like this. HTML:

<ul class="list-menu">
<li class="sort-menu">4</li>
    <div class="sort-list-dropdown">
         <ul class="sort-list">
             <li>4</li>
         </ul>
    </div>
</ul>

当你复制这两次，然后当你点击类上的4，说 sort-menu ，它会放置两个菜单容器，该类是 sort-list-dropdown

When you duplicate this two times and then when you click the 4 on the class that says sort-menu, it will put up two menus containers and that class is sort-list-dropdown I have been playing with JS I got from somewhere and I'm getting confused about this issue.

JavaScript：

JavaScript:

    $("ul.list-menu > li").click(function () {
    var X = $(this).attr('id');
    if (X == 1) {
        $("ul.sort-list > li").hide();
        $(this).attr('id', '0');
    } else {
        $("ul.sort-list > li").show();
        $(this).attr('id', '1');
    }
});

//Mouse click on sub menu
$("ul.sort-list > li").mouseup(function () {
    return false;
});

//Mouse click on my account link
$("ul.list-menu > li").mouseup(function () {
    return false;
});


//Document Click
$(document).mouseup(function () {
    $("ul.sort-list > li").hide();
    $("ul.list-menu > li").attr('id', '');
});

我得到一些变量，但我不认为它是代码。我想我需要输入一个新的变量，但我不知道它需要什么。

I get some of the variables but I do not think it's the code. I think I need to input a new variable but I do not know what does it need for it.

如果有人知道如何完成这一点，那么请回复我。

If anybody knows how to accomplish this, then please reply back to me.

推荐答案

我对这个问题有一个答案。请尝试以下代码：

I have one answer for this problem. Please try this code below:

$(document).ready(function() {
     $('.sort-list-dropdown').hide();
     $('ul.list-menu li').click(function() {
            $(this).next('.sort-list-dropdown').toggle();
     });
});

在代码点击中，您可以将其更改为 hover '。

In code 'click', you can change it to 'hover'.

这篇关于点击下拉导航菜单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！