Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/389.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
如果正文中有一个类,则在scroll native javascript上删除_Javascript_If Statement_Scroll_Window_Removeclass - Fatal编程技术网

如果正文中有一个类,则在scroll native javascript上删除

如果正文中有一个类,则在scroll native javascript上删除,javascript,if-statement,scroll,window,removeclass,Javascript,If Statement,Scroll,Window,Removeclass,我尝试使用本机javascript,因此没有加载jquery。我想在body元素中创建一个if语句,以删除一个类,前提是它有一个类。这样我就避免了每次有滚动时都触发它。我基本上希望它只在窗口滚动并且主体应用了这个类的情况下删除这个类,否则它不应该触发 我试过使用这段代码,它确实删除了这个类,但它总是在滚动时触发,不管body是否应用了一个类。在这种情况下。。。我在控制台上看到scrollEvent与我在页面上所做的每个滚动一起打印。你是怎么做这项工作的 if(document.body.clas

我尝试使用本机javascript,因此没有加载jquery。我想在body元素中创建一个if语句,以删除一个类,前提是它有一个类。这样我就避免了每次有滚动时都触发它。我基本上希望它只在窗口滚动并且主体应用了这个类的情况下删除这个类,否则它不应该触发

我试过使用这段代码,它确实删除了这个类,但它总是在滚动时触发,不管body是否应用了一个类。在这种情况下。。。我在控制台上看到scrollEvent与我在页面上所做的每个滚动一起打印。你是怎么做这项工作的

if(document.body.classList){

    window.addEventListener('scroll', function(){
        console.log('scrollEvent');

        document.body.classList.remove('mobile-menu-open');

    });
}

您的if需要检查该类

window.addEventListener('scroll', function(){
    console.log('scrollEvent');

    // do the following only if it has the class
    if( document.body.classList.contains('mobile-menu-open') ) {

       document.body.classList.remove('mobile-menu-open');

    }

});

您可以删除侦听器,一旦您的类从
主体中删除,这样当您滚动时它就不会再触发

代码如下:

var removeMenuClass = function() {
    document.body.classList.remove('mobile-menu-open');
    // remove the scroll listener
    window.removeEventListener('scroll', removeMenuClass, false);
}

// add the scroll listener
window.addEventListener('scroll', removeMenuClass, false);

如果需要(比如当“移动菜单”重新打开时),您可以用同样的方法重新连接eventListener。

如果您在删除类后也删除侦听器,这个答案将是完美的:)听起来类的存在是效果的触发因素。因此,我假设它可以被重新添加,在这种情况下,与每次添加/删除事件处理程序相比,执行布尔检查更容易,也可能更有效。我不同意,我想我只添加我自己的答案。感谢大家的答案,我学到了很多,Matt Pileggi的答案无论我打开和关闭菜单多少次都有效。Skwal的答案只在第一次有效,但之后就不能正常工作。如果您有任何链接可以帮助我了解nativa javascript,请这样做。。我在这一刻使用:,嘿,这似乎是工作,但只有在第一个滚动类被删除。如果我在打开导航后(因此再次添加该类)并滚动,则该类将保留在主体上。我如何创建一个可持续的代码来检查主体上是否有类,如果有,如果有滚动,则将其删除。这是有效的,但奇怪的是只有一次。它写在我的答案里。当菜单打开时,您只需重新连接事件侦听器。