Javascript MaterializeCSS：如何在按下一个按钮（打开和关闭）时切换两个通知

我把我的个人网站放在这个链接上

在某些内容上工作时。我在顶部右侧的导航栏中创建了一个容器启用/禁用按钮。
该按钮非常适合将容器类添加到

div

标记中。我还制作了一些东西，让用户知道容器类是否被激活。但问题是它不起作用，或者当按下两次时，它们会显示相同的通知，如

容器处于打开状态

（它应该是

容器处于打开状态

，而

容器处于关闭状态

）或者它最终在控制台中给出了一个错误，比如

uncaughtsyntaxerror:Unexpected token invalign

和

uncaughtsyntaxerror:Unexpected token）

但首先，这里是激活容器的代码。

HTML

<li>
    <a href="#" id="ToggleContainer-NoficationStatus" class="tooltipped toggle-container waves-effect waves-red" data-position="bottom" data-delay="100" data-tooltip="Iam a Container Adder-Disabler :)">
        <i class="material-icons">web</i>
    </a>
</li>

我3个小时前就在开发这项功能，但仍然无法继续，也无法在互联网上找到任何解决方案。尽管有，但它不起作用。我妈妈因为在电脑前花了12个小时处理我的一些私人项目而生气。 我需要一些帮助：）我的意思是如何修复这个错误？感谢您的帮助。：）

信息

---

找出错误实际发生的地方。请转到我的网站，错误在右上角的按钮中。图标类似于网页布局图标。

考虑您的评论，发布答案。根据需要更新脚本，使脚本更加简单高效

$（'.toggle container'）。单击（函数（）{
//步骤1：它将在开始时切换类
$（'#adder'）。toggleClass（'container'）；
//步骤2：检查“#adder”是否具有class=conatiner并显示toast，如果没有，则转到步骤3
if（$（“#加法器”）.hasClass（“容器”））
{
警报（“容器布局打开”）；//在此处编写setTimeout函数。
}
//步骤3：检查“#adder”是否没有class=conatiner并显示toast。
if（！$（“#加法器”）.hasClass（“容器”））
{
警报（“容器布局已关闭”）；//在此处编写setTimeout函数。
}
});


//这就是Container类的工作
首先检查打字错误，我会在脚本代码中的两个地方加上引号。在脚本代码中为
$（“#adder”）
添加引号。@divy3993谢谢您的回复。：）通知出现了，但还有一个问题。当容器类被激活时。当容器布局打开时，通知显示。但是当我关掉它的时候。它说的是相同的（
容器布局在
上）。注意，我还为“关闭容器类时”编写了脚本。这也是我在这里发布的时候遇到的问题。（我只是在发布之前更改了代码）你是现场更新的吗？好的，发布了答案，请查看。如果仍然需要帮助，请随时询问。是的，网站正在更新。请查看类似Materialize.css这样的结果书，它没有添加到代码段中。顺便说一句，我会试试这个。我不认为发出警报就等于发出通知。但我还是会尽我所能去尝试。：）将检查您编写的脚本。@CodexLink只需替换行
警报（…）
使用您的
设置超时
函数。@CodexLink不，没有添加，
警报
只是给您解释一下。哦，好的，谢谢。我以为你说的警告是关于在标签上显示它。或者像确认之类的。但是无论如何，我会再次尝试，我所做的是
setTimeout（function（）{Materialize.toast（“Container Layout is ON”）；3000）；}，1000是这样做的，但祝酒词没有出现或通知没有出现。对我将
警报
更改为
物化.土司
，我还添加了计时器，但我想我做得对。还有一个问题，它给出了一个错误
Uncaught SyntaxError:Unexpected token）
<script type="text/javascript">
    $('.toggle-container').click(function(){
        $('#adder').toggleClass('container');
    });
</script>

<script type="text/javascript">
    $(document).ready(function(){
        $("#ToggleContainer-NoficationStatus").click(function() {
            $(#adder).hasClass("container");
            setTimeout(function() {
                Materialize.toast('Container Layout is On.', 2000);
            }, 500);
        });
    });
</script>

<script type="text/javascript">
    $(document).ready(function(){
        $("#ToggleContainer-NoficationStatus").click(function() {
            (!$(#adder).hasClass("container"));
            setTimeout(function() {
                Materialize.toast('Container Layout is Off.', 3000);
            }, 1000);
        });
    });
</script>
<div id="adder" class=""> //This is where the Container Class Goes on