我目前正在处理一个html表单。如何将密码的最小长度设置为8,以便拒绝用户输入的小于8的密码。如何执行此操作?
这是代码:
<div id="login-form">
<form method="post">
<table align="center" width="30%" border="0">
<tr>
<td><input type="text" name="email" placeholder="Your Email" required /></td>
</tr>
<tr>
<td><input type="password" name="pass" placeholder="Your Password" required /></td>
</tr>
<tr>
<td><button type="submit" name="btn-login">Sign In</button></td>
</tr>
<tr>
<td><a href="register.php">Sign Up Here</a></td>
</tr>
</table>
</form>
</div>
如果您使用的是HTML5,则可以使用pattern和输入标记的必需属性:
<input type="password" pattern=".{8,}" required title="8 characters minimum">
<input type="password" pattern=".{8,12}" required title="8 to 12 characters">
还有输入标签的minlength属性,但它在some browsers中不起作用:
<input type="password" minlength="8" required>
将您的按钮更改为:
<button name="btn-login">Sign In</button>
并添加此代码JavaScript(使用jquery):
$('button[name="btn-login"]').click(function() {
if($('input[name="pass"]').val().length < 8) {
alert('Minimum length = 8');
} else {
$('form').submit();
}
});
别忘了将这个条件添加到PHP代码中。
您可以使用pattern属性:
<input pattern=".{8,}" type="password" name="pass" placeholder="Your Password" required />
遗憾的是,所有浏览器都不支持最小长度属性。请check this out
因此,必须使用另一种方法。
我选择了如下所示的正则表达式的使用;
<input type="password" name="pass" title="Password must be 8 characters including 1 uppercase letter, 1 lowercase letter and numeric characters" required pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" >
你可以使用minlength
和maxlength
像往常一样,您可以使用minlength和maxlength属性来确定密码的最小和最大可接受长度。此示例通过指定用户的PIN必须至少为四位且不超过八位数来扩展前一个示例。 size属性用于确保密码输入控件的宽度为八个字符。
But it works on Chrome only at the moment.
或者,正如已经提到过的人,你可以使用pattern
。
如果您的应用程序具有字符集限制或对输入密码的实际内容的任何其他要求,则可以使用pattern属性建立正则表达式,以用于自动确保您的密码满足这些要求。