根据课程的可用性添加和删除课程答案

【问题标题】：Add and remove class upon availability of a class根据课程的可用性添加和删除课程
【发布时间】：2019-12-26 04:22:49
【问题描述】：

如果子 div 中有一个类，我正在向父 div 添加一个类。但同时，如果子 div 中不存在该类，则希望从父 div 中删除该类。

我使用了以下代码，它添加了类，但是当子 div 中不存在该类时，它不会从父类中删除该类：

jQuery(function($){
    if(jQuery(".mtsnb-top").hasClass('mtsnb-shown')) {
        jQuery("body").addClass('test');
    } else if (jQuery(".mtsnb-top").hasClass('mtsnb-hidden')) {
        jQuery("body").removeClass('test');
    }
});

不知道这里有什么问题。

我还添加了切换类方法。

jQuery(function($){
    if(jQuery(".mtsnb-top").hasClass('mtsnb-shown')) {
        jQuery("body").toggleClass('test');
    }
});

但这也不符合我的要求。

我想，如果子 div 中有一个类 mtsnb-top，那么父 div 有一个类 test，如果类 >mtsnb-top 不存在于子 div 中，然后类 test 将从父 div 中删除。

有人能指出上面的代码哪里错了吗？

作为参考，this is 页面的 url，我指的是顶部通知栏。如果显示栏，想要向 body 标签添加一个类。如果那是隐藏的，那么该类将从正文中删除。

【问题讨论】：

将您的代码放入document ready 块并尝试jQuery("body").addCLass('test'); 而不是jQuery("body").toggleCLass('test');
对不起，我修改了我的代码。我已经添加了addclass。这增加了课程。但是当子类被删除时，removeclass 不起作用
你必须在你的子类被移除时触发事件。

标签： javascript jquery

【解决方案1】：

您可以通过使用带有第二个参数的toggleClass 方法来消除if/else 语句，如果第二个参数为真，则添加该类，否则删除该类：

var childHasShownClass = jQuery('.mtsnb-top').hasClass('mtsnb-shown');
jQuery('body').toggleClass('test', childHasShownClass);

当然，这意味着如果子元素具有mtsnb-shown 类，则body 元素将具有test 类，否则不会（即使子元素也不存在mtsnb-hidden）。

我看到的唯一其他潜在问题是您的第一个代码示例中的toggleCLass 应该是toggleClass。小写 l 而不是 L，除非这只是一个错字并且您的实际代码是正确的。

【讨论】：

根本没有添加类:(
更新了我的答案。确保在第一行中有.mtsnb-top（点在开头）。我原来的答案没有，所以jQuery('mtsnb-top') 根本不会返回该元素。
正在添加类。但不删除它。你能检查一下吗？
您在代码中的哪个位置调用它？您是否在某个时候从孩子身上删除了mtsnb-shown，然后调用这些代码来切换主体上的类？

【解决方案2】：

查找具有类“mtsnb-top”的子元素的数量，然后添加/删除类“test”。

if(jQuery('.parent').find('.mtsnb-top').length) {
    jQuery('.parent').addClass('test');
} else {
    jQuery('.parent').removeClass('test');
}

【讨论】：

正在添加类。但不删除它。你能检查一下吗？