Jquery 两个独立的下拉框。一个在悬停状态下单击另一个

这似乎是一个简单而直截了当的问题，而且可能有一个直截了当的答案。我的工具栏中有两个下拉框，一个在悬停时下拉，另一个在单击时下拉，另一个在悬停时下拉

我一辈子都想不出如何让它们独立运行。我对jquery非常陌生，在来到这里之前，我已经浏览过互联网

小提琴没有css，但仍然做同样的事情

这是jquery

$(document).ready(function () { 

$('#discoverDrop').hover(
    function () {
        //show its submenu
        $('ul, this').slideDown(500);

    }, 
    function () {
        //hide its submenu
        $('ul, thid').slideUp(500);         

});



$('#profile').toggle(function(){
        $('ul, this').slideDown(500);
    }, function(){
        $('ul, this').slideUp(500);
    });


});

以及必要的标记

<span id="discoverDrop">
       <span id="drop"><m2>Discover</m2>
        <ul>
         <li><m2><a href="../artists"><m2>Artists</m2></a></li></m2>
         <li><m2><a href="../tracks"><m2>Tracks</m2></a></li></m2>
         <li><m2><a href="../sessions"><m2>Sessions</m2></a></li></m2>
         <li><m2><a href="../gigs"><m2>Gigs</m2></a></li></m2>
        </ul>         
       </span>
      </span>

      <span id="profile">
        <span id="profileDrop">
          <ul>
           <li><m2><a href="../phpscripts/logout.php"><m2>Logout</m2></a></li></m2>
           <li><m2><a href="../tracks"><m2>Tracks</m2></a></li></m2>
           <li><m2><a href="../sessions"><m2>Sessions</m2></a></li></m2>
           <li><m2><a href="../gigs"><m2>Gigs</m2></a></li></m2>
        </ul>         
        </span>
      </span>

发现

$（arg1，arg2）

arg1

通常是一个包含我们需要选择的选择器的字符串

arg2

是一个

jQuery对象

，我们应该在其中检查它

执行

$（'ul，this'）

将传递一个参数

'ul，this'

，jQuery将在整个文档中搜索带有标记名

'ul'

和

'this'

的元素

执行$

（'ul'，this）

看起来像是您想要的

$(document).ready(function () {
    $('#discoverDrop').hover(
        function () {
            //show its submenu
            $('ul', this).slideDown(500);

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

    });
    $('#profile').toggle(function(){
            $('ul', this).slideDown(500);
        }, function(){
            $('ul', this).slideUp(500);
        });

});

---

---

我不熟悉

'ul，this'

语法。这是什么意思？是的，我通常会做$（这个）。找（'>ul'）你可能需要$（'ul'，这个）。另外还有一个“thid”，ul引用了标记中的

，而this引用了已经被称为#discoverDrop的。ul，这似乎是错误。你还有其他建议吗？“ul”，这是我以前的建议，但对我没有帮助。两者都做同样的事情。

<span id="discoverDrop">
   <span id="drop"><m2>Discover</m2>
        <ul>
         <li><m2><a href="../artists"><m2>Artists</m2></a></li></m2>
         <li><m2><a href="../tracks"><m2>Tracks</m2></a></li></m2>
         <li><m2><a href="../sessions"><m2>Sessions</m2></a></li></m2>
         <li><m2><a href="../gigs"><m2>Gigs</m2></a></li></m2>
        </ul>         
   </span>
</span>

<span id="profile">
    Click Me to Toggle
    <span id="profileDrop">
        <ul>
           <li><m2><a href="../phpscripts/logout.php"><m2>Logout</m2></a></li></m2>
           <li><m2><a href="../tracks"><m2>Tracks</m2></a></li></m2>
           <li><m2><a href="../sessions"><m2>Sessions</m2></a></li></m2>
           <li><m2><a href="../gigs"><m2>Gigs</m2></a></li></m2>
        </ul>         
    </span>
</span>

<span id="profile">
...
</span>
<span id="discoverDrop">
...
</span>