添加警报到Javascript验证

时间:2015-05-24 08:26:30

标签: javascript

我的网站上有这个Javascript和PHP代码(用于登录系统):

<form id='login' style="position: absolute; top: 10px; right: 100px;" action='<?php echo $fgmembersite->GetSelfScript(); ?>' method='post' accept-charset='UTF-8'>
<input type='hidden' name='submitted' id='submitted' value='1'/>
<div><span class='error'><?php echo $fgmembersite->GetErrorMessage(); ?></span></div>
<input type='text' name='username' class="formlogin" placeholder='Username' id='username' value='<?php echo $fgmembersite->SafeDisplay('username') ?>' maxlength="20" />
<span id='login_username_errorloc' class='error'></span>
<input type='password' class="formlogin" placeholder="Password" name='password' id='password' maxlength="50" />
<span id='login_password_errorloc' class='error'></span>
<input type='submit' name='Submit' value='Submit' />
<div class='short_explanation'><a href='reset-pwd-req.php'>Forgot Password?</a></div>
</form>
<script>
var frmvalidator  = new Validator("login");
frmvalidator.EnableOnPageErrorDisplay();
frmvalidator.EnableMsgsTogether();
frmvalidator.addValidation("username","req","Please provide your username");
frmvalidator.addValidation("password","req","Please provide the password");
// ]]>
</script>
</ul>
</div>

目前,如果用户未输入密码,则会显示“请提供密码”的文字。如何编辑以使密码字段从白色变为红色?

1 个答案:

答案 0 :(得分:0)

您可以使用纯CSS(example

<style>
    input:invalid {
        border: 1px solid green;
    }
    :required { 
        background-color: yellow;
    }
<style>

<input type="email" required>