Question

我基本上试图在jQuery中应用向下滑动导航。我使用这段代码：

<script>
    $(document).ready(function() {
        $(".menu").hover(function(){
            $(".submenu").animate({ height: 'show', opacity: 'show' }, 'slow');
        }, function(){
            $(".submenu").animate({ height: 'hide', opacity: 'hide' }, 'slow');
        });
    });
</script>

但当我将鼠标悬停在.menu div上时，所有.submenu div都会向下滑动。所以我尝试使用$(this)来完成它。但我不知道该怎么做。

Answer 1

您需要使用this作为上下文来搜索其中的.submenu元素，如下所示：

$(document).ready(function() {
    $(".menu").hover(function(){
        $(".submenu", this).animate({ height: 'show', opacity: 'show' }, 'slow');
    }, function(){
        $(".submenu", this).animate({ height: 'hide', opacity: 'hide' }, 'slow');
    });
});

Answer 2

如今，你想绑定这样的事件：

   $(document.body).on({
       mouseover : function(e) {
             $(this).find(".submenu")...
         },
       mouseout  : function (e) {
            //...
          }
       //,...
     },".menu");

如何在jquery中使用$（this）在子元素上应用函数

2 个答案: