模态弹出窗口已停止运行答案

【问题标题】：Modal pop up has stopped functioning模态弹出窗口已停止运行
【发布时间】：2018-07-04 10:34:23
【问题描述】：

第三方开发人员为我们的团队会面页面创建了一个模式弹出窗口。由于某种原因它已停止工作。

点击员工图片，他们的详细信息应显示在图片下方

页面是：https://www.bennettsfunerals.co.uk/about-bennetts-funeral-directors-essex/meet-the-team/

我在下面粘贴了我认为是函数脚本的内容。

为什么会突然停止工作！！！？？？

===============================================

$('.team').click(function() {

            var _this = $(this);

            if( $(_this).hasClass('active') )

            {

                return false;

            }

            else

            {

                $('.team.active').removeClass('active');

                $(_this).addClass('active');

                $('body').prepend('<div class="overlay"></div>');
            }
        });

        $(window).on('click', '.overlay', function(e) {

            $('.team.active').removeClass('active');

            $('.overlay').remove();

        });



        $('.close-overlay').click(function(e) {

            e.preventDefault();

            $('.team.active').removeClass('active');

            $('.overlay').remove();

            return false;
        });

        $('.print').click(function(e) {

            e.preventDefault();

            window.print();
        });
    });




        $('.close-overlay').click(function(e) {

            e.preventDefault();

            $('.team.active').removeClass('active');

            $('.overlay').remove();

            return false;
        });

        $('.print').click(function(e) {

            e.preventDefault();

            window.print();
        });
    });

【问题讨论】：

标签： javascript jquery popup popupwindow

【解决方案1】：

如果您查看开发人员控制台，您会发现索引文档的第 1048 行存在语法错误。导致该错误是因为缺少大括号：

$('#responsive-sidebar-button').click(function() // need a curly bracket here

    if($('.sidebar').hasClass('opened')) {

        $('.sidebar').removeClass('opened');

        $('.sidebar').slideUp();

    } else {

        $('.sidebar').addClass('opened');

        $('.sidebar').slideDown();

    }

});

所以你最终会得到这个：

$('#responsive-sidebar-button').click(function(){

    if($('.sidebar').hasClass('opened')) {

        $('.sidebar').removeClass('opened');

        $('.sidebar').slideUp();

    } else {

        $('.sidebar').addClass('opened');

        $('.sidebar').slideDown();

    }

});

【讨论】：

【解决方案2】：

代码由于语法错误而损坏（Uncaught SyntaxError: Unexpected token if）。 您的索引文件的第 1046 行缺少大括号 ({)。

行：1046

$('#responsive-sidebar-button').click(function() //function curly brace is missed

    $('#responsive-sidebar-button').click(function() { //Need to add this curly brace here.

【讨论】：

【解决方案3】：

代码可以正常工作。如果您复制以下代码并在控制台中运行，您所需的输出将起作用。由于存在缺少{ 大括号的问题，因此单击事件侦听器将不会在img 上注册。所以它没有工作。

$('.team').click(function() {
    var _this = $(this);
    if( $(_this).hasClass('active') )
    {
       return false;
    }
    else
    {
       $('.team.active').removeClass('active');
       $(_this).addClass('active');
       $('body').prepend('<div class="overlay"></div>');
    }});
$('.close-overlay').click(function(e) {
    e.preventDefault();
    $('.team.active').removeClass('active');
    $('.overlay').remove();
    return false;
});

【讨论】：