导航栏上的Jquery下拉菜单无法正常运行

Question

我在jquery中有一个下拉栏：

 $(document).ready(function(){
        $(".dropbtn").hover(function(){
            $(".dropdown-content").slideDown("fast");
            $(".dropdown-content").show;
        });
        $(".dropdown").mouseout(function(){
            $(".dropdown-content").slideUp("fast");
        });
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
    <li class="dropdown">
    <a href="javascript:void(0)" class="dropbtn">##</a>
      <div class="dropdown-content">
        <a href="#">##</a>
        <a href="#">##</a>
      </div>
    </li>
    </ul>

当我将鼠标悬停在下拉菜单上时，下拉内容会向下滑动，但如果内容没有滑动，我就不能将鼠标悬停在内容上。我知道问题在于jquery中的mouseout函数，但我尝试过的任何东西都无法修复它。

Answer 1

试试这个：

<script>
    $(document).ready(function () {
    $(".dropbtn").hover(function () {
        $(".dropdown-content").slideDown("fast");
        $(".dropdown-content").show();
    });

    $(".dropdown-content").hide();

    $(".dropdown").mouseout(function () {
        $(".dropdown-content").mouseout(function () {
            $(".dropdown-content").slideUp("fast");
            $(".dropdown-content").show();
        });

    });
});
</script>