Question

我很困惑。我有一个简单的触发元素显示/隐藏一个元素，但我似乎永远不会让它只使用一个元素。我认为这可能是我构建JS的方式，但我不明白为什么它不会起作用。以下是一些做同样事情的变体，但它们似乎都没有效果。

有任何帮助吗？感谢。

function overlays() {
    $('.header-container .info-trigger').on('click touchstart', function(e) {
        $(this).addClass('active');
        $('body').addClass('overlay-open');
        $('.info-overlay').fadeIn('fast');
        e.preventDefault();
    });
    $('.header-container .info-trigger.active').on('click touchstart', function(e) {
        $('.info-overlay').fadeOut('fast', function() {
            $('.info-overlay').removeAttr('style');
        });
        $('body').removeClass('overlay-open');
        e.preventDefault();
    });
}
overlays();


function overlays() {
    if ($('body').is('.overlay-open')) {
        $('.header-container .info-trigger').on('click touchstart', function(e) {
            $('.info-overlay').fadeOut('fast', function() {
               $('.info-overlay').removeAttr('style');
            });
            $('body').removeClass('overlay-open');
            e.preventDefault();
        });
    } else {
        $('.header-container .info-trigger').on('click touchstart', function(e) {
            $('body').addClass('overlay-open');
            $('.info-overlay').fadeIn('fast');
            e.preventDefault();
        });
    }
}
overlays();


function overlays() {
    $('.header-container .info-trigger').on('click touchstart', function(e) {
        $('body').addClass('overlay-open');
        $('.info-overlay').fadeIn('fast');
        e.preventDefault();
    });
    $('body.overlay-open .header-container .info-trigger').on('click touchstart', function(e) {
        $('.info-overlay').fadeOut('fast', function() {
            $('.info-overlay').removeAttr('style');
        });
        $('body').removeClass('overlay-open');
        e.preventDefault();
    });
}
overlays();

Answer 1

$('body').is('overlay-open')

应该是

$('body').is('.overlay-open')

您似乎错过了所有地方的类选择器。。

在你正在检查一个名为overlay-open的元素，我认为这是一个你正在应用于身体的类。

根据条件添加点击事件也是一个坏主意。

更好的方法是分配一个事件处理程序并在其中使用条件来使其正常工作。

function overlays() {
    $('.header-container .info-trigger').on('click touchstart', function (e) {
        e.preventDefault();

        var $this = $(this); // cache selector
        // Check for active class and do the action
        if ($this.hasClass('active')) {
            $('.info-overlay').fadeOut('fast', function () {
                $('.info-overlay').removeAttr('style');
            });
            $('body').removeClass('overlay-open');
        } else {
            $this.addClass('active');
            $('body').addClass('overlay-open');
            $('.info-overlay').fadeIn('fast');
        }
    });
}
overlays();

Answer 2

请与每次点击的文件绑定

@echo off
    setlocal enableextensions disabledelayedexpansion

    call :getBatchFolder MY_HOME
    echo %MY_HOME%

    goto :eof

:getBatchFolder returnVar
    set "%~1=%~dp0"
    goto :eof

如果仍然无效，则显示错误控制台

显示/隐藏叠加的简单触发元素（最佳实践）

2 个答案: