我需要验证一个简单的 PIN/密码表单,然后在正确的情况下能够提交。
如何验证此 PIN 码 如果密码错误,则显示一条消息。 如果密码正确,则启用按钮并继续! 任何帮助将非常感激。
HTML:
<form>
<input type="password" maxlength="1" id="" name="pass" />
<input type="password" maxlength="1" id="" name="pass" />
<input type="password" maxlength="1" id="" name="pass" />
<input type="password" maxlength="1" id="" name="pass" />
<input type="submit" value="submit" id="submit" disabled="disabled" />
</form>
JS:
$("form").validate({
rules: {
pass: {
required: true,
minlength: 4,
equalTo: "0000"
}
},
messages: {
pass: {
required: "Please provide a PIN DIGIT",
minlength: "Please enter at least 4 numbers"
}
}
});
最佳答案
为此,您必须使用 jQuery Ajax。
制作一个简单的 PHP 脚本,它将获取 POST 数据,这将是您的密码,如果密码匹配(例如与您的数据库匹配),或者直接硬编码到 PHP 脚本,它将回显 true,否则 false。如果您不使用 PHP,并且将 PIN 存储在 Javascript 中,那么其他人将可以看到它。
编辑:这应该根据您的设计工作。
<form>
<input type="password" maxlength="1" id="digit1" class="pass" />
<input type="password" maxlength="1" id="digit2" class="pass" />
<input type="password" maxlength="1" id="digit3" class="pass" />
<input type="password" maxlength="1" id="digit4" class="pass" />
<input type="submit" value="submit" id="submit" disabled="disabled" />
</form>
JS:
$( document ).ready(function() {
$(".pass").keydown( function() {
pass=$("#digit1").val() + $("#digit2").val() + $("#digit3").val() + $("#digit4").val();
$.ajax({
type: "POST",
url: "passCheck.php",
data: "password="+pass,
success: function(html){
if(html=='true') {
$("#submit").removeAttr("disabled");
}
else {
$("#submit").attr('disabled','disabled');
}
},
});
});
});
PHP:(以防万一)
$pass = $_POST["password"];
if ($pass == "1234")
echo "true";
else
echo "false";
编辑2: 如果你不想使用PHP和Ajax,只是为了原型(prototype)设计和玩弄它,你可以使用简单的检查,但强烈不推荐它,因为每个人都可以在代码中看到pass:
JS:
$( document ).ready(function() {
$(".pass").keydown( function() {
pass=$("#digit1").val() + $("#digit2").val() + $("#digit3").val() + $("#digit4").val();
correctPass = "1234";
if(pass==correctPass) {
$("#submit").removeAttr("disabled");
}
else {
$("#submit").attr('disabled','disabled');
}
});
});
关于javascript - Jquery密码(4位数字)验证,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23363450/