javascript - 订阅按钮后获取JavaScript答案的问题

我正在做一个只有一个字段的表单：一个密码表单。提交密码时，我只希望JavaScript告诉用户密码是否正确，还是必须重试。
这是我的代码：

var x = document.forms["CodeForm"]["email"].value;
if (x == "MAX") {
    $message._show('success', '✅ Code Correct !');
} else {
    $message._show('failure', '❌ Code Incorrect !');
}

如您所见，“成功”和“失败”部分适用于我的CSS类，后者在脚本之后告诉脚本颜色。现在，我的问题是当我输入任何内容时，“ if”部分有效，并且显示“ Code Incorrect！”。以红色显示（如我所愿），但是如果我随后输入了正确的代码，则显示“代码正确”，但显示为红色，而不是CSS类“成功”中的绿色。当我首先输入好的代码（重新加载页面后）时，它变成绿色。

如果您想尝试，这里是我的网站，好的代码是“ MAX”：http://enigma-door.000webhostapp.com

以下是表单和_show方法的html代码：

<form name="CodeForm" id="signup-form" method="post" action="#">
    <input type="text" name="email" id="email" placeholder="Code" />
    <input type="submit" value="Valider" />
</form>

$message._show = function(type, text) {
    $message.innerHTML = text;
    $message.classList.add(type);
    $message.classList.add('visible');

    window.setTimeout(function() {
        $message._hide();
    }, 3000);
};

最佳答案

在$ message._show方法内，请删除现有的类，然后它将起作用。$message.classList.remove("failure");
由于您的失败CSS类没有被删除，它具有很高的特异性，并且对于成功而言是最重要的