javascript - 在特定条件下使用 jquery 删除类以正确对齐子菜单

Question

我需要从中删除某个 css 类.nav，以便它正确出现。现在它的行为是基于不同的屏幕尺寸的意外。

小提琴示例

演示视图

您会注意到下拉子菜单没有正确显示。我希望下拉列表显示在下拉列表的右侧，当它在右侧有足够的空间时，在下拉列表的左侧，当它基于<div class="main-wrapper">宽度（1000px 宽）的空间较少时。

我尝试使用以下代码修复它，但它无法正常工作：

$(document).ready(function(){
    $(".nav").on("mouseenter", " > li", function(){

        /*if dropdown is likely to go out of parent nav then right align it :) */
        if (($(this).offset().left) + 200 > $('.menu-wrapper').width()) {
            $(this).find(".dropdown").addClass("dropdown-last");
        }
        if($(this).hasClass("has-panel")){
           // $(this).find(".dropdown").removeClass("dropdown-last");
            //alert('has class');
        }
        else
        {
        //alert('has no class');
        }
    });

    /* if dropdnw*/
    $(".dropdown").each(function(){
        var $this = $(this);
        if($this.find(".dd-panel").length > 0){
            $this.addClass('has-panel');

        }


        if($this.find(".dd-panel").length = 1){
           $(".dropdown").css( "min-height", "80px" );
        }
    });
});

在调试时，dropdown has-panel dropdown-last如果它具有类的 divhas-panel和一个没有大型菜单的 div 类，则它将以下内容显示为 div 类dropdown dropdown-last。我试图使用 jQuery 检查元素是否具有类。如果它有 class has-panel，那么什么也不做，如果它没有 class has-panel，那么我需要dropdown-last从不能使用以下代码的同一元素中删除该类：

if($(this).hasClass("has-panel")){
   // $(this).find(".dropdown").removeClass("dropdown-last");
    alert('has class');
}
else
{
//alert('has no class');
}

Answer 1

删除$(window).load(function(){}，它会工作

Answer 2

使用代码解决

    if( $(this).find(".dropdown").hasClass("has-panel")){
       // $(this).find(".dropdown").removeClass("dropdown-last");
        //alert('has class');
    }
    else
    {
    //alert('has no class');
     $(this).find(".dropdown").removeClass("dropdown-last");
    }