无法显示警报消息

时间:2018-06-09 23:59:34

标签: jquery html ajax

我正在尝试创建一个只包含一个有效用户名和密码的简单登录页面。因此,我不需要使用MySQL来存储其他有效的用户名和密码。

单击按钮后,我无法显示警告消息。 谁知道问题是什么? 当我点击按钮时,所有页面都会自动刷新,删除我之前创建的任何条目。

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script>
$(document).ready(function() {
    $(':input[type="submit"]').prop('disabled', true);
     $('input[type="email"]').keyup(function() {
        if($(this).val() != '') {
           $(':input[type="submit"]').prop('disabled', false);
        }
     });
    $('#loginButton').click(function() {
        var ValidUser = $('#usernameInput').val() === 'admin@company.com';
        var ValidPassword = $('#passwordInput').val() === 'dogcat';
        if (ValidEmail === true && ValidPassword === true)
        {
            alert("Login Successful");
        }
        else
        {
            alert("Incorrect Username/Password");
        }
    });
});
</script>

<title>Login</title>

</head>

<body>
<div id="loginMenu">
<span>
<form id="formLogin" name="login">
<Label>Username:</Label>
<br/>
<input id="usernameInput" name = "username" type="email" required="required">
<br/>
<label>Password:</label>
<br/>
<input id="passwordInput" name="password" type="password" required="required">
<br/>
<input id="loginButton" type="submit" value="Log In">
</form>
</span>
</div>
</body>
</html>

1 个答案:

答案 0 :(得分:1)

如果您在浏览器中按F12,您将看到代码是否有任何错误。在您的情况下,事实证明您使用的是未定义的变量ValidEmail。请改用ValidUser,您会看到提醒。这是我为您的代码设置的punker link

我也假设你的是测试页而不是生产代码。