在将我的问题标记为重复之前,请仔细阅读我的问题。
嗨,我尝试在按键时动态验证密码。 实际上,在输入密码时它对我起作用。 但是当我删除密码时,只有两个条件满足。 我的代码和图像如下:
我的密码框HTML代码是
<div class="form-group has-feedback">
<input class="form-control" id="NewPassword" placeholder="New Password" onkeypress="EnterPassword()" onkeydown="DeletePassword()" type="password">
<span class="glyphicon glyphicon-lock form-control-feedback"></span>
</div>
我在密码条件前使用了glyphicon-remove。当我输入密码时,如果满足条件,每个图标都会变成glyphicon-ok。
假设我的密码为Password@123,它包含了我需要的所有内容,所以所有图标都变成了ok。
以下是该函数的代码:
<script type="text/javascript" >
function EnterPassword() {
$("#NewPassword").keyup(function () {
var regex1 = new Array();
var regex2 = new Array();
var regex3 = new Array();
var regex4 = new Array();
regex1.push("[A-Z]"); //Uppercase Alphabet.
regex2.push("[a-z]"); //Lowercase Alphabet.
regex3.push("[0-9]"); //Digit.
regex4.push("[!@@#$%^&*]"); //Special Character.
if ($(this).val().length>6) {
$("#Length").removeClass("glyphicon glyphicon-remove").addClass("glyphicon glyphicon-ok");
}
for (var i = 0; i < regex1.length; i++) {
if (new RegExp(regex1[i]).test($(this).val())) {
$("#UpperCase").removeClass("glyphicon glyphicon-remove").addClass("glyphicon glyphicon-ok");
}
}
for (var i = 0; i < regex2.length; i++) {
if (new RegExp(regex2[i]).test($(this).val())) {
$("#LowerCase").removeClass("glyphicon glyphicon-remove").addClass("glyphicon glyphicon-ok");
}
}
for (var i = 0; i < regex3.length; i++) {
if (new RegExp(regex3[i]).test($(this).val())) {
$("#Numbers").removeClass("glyphicon glyphicon-remove").addClass("glyphicon glyphicon-ok");
}
}
for (var i = 0; i < regex4.length; i++) {
if (new RegExp(regex4[i]).test($(this).val())) {
$("#Symbols").removeClass("glyphicon glyphicon-remove").addClass("glyphicon glyphicon-ok");
}
}
});
}
function DeletePassword() {
$("#NewPassword").keyup(function () {
var regex1 = new Array();
var regex2 = new Array();
var regex3 = new Array();
var regex4 = new Array();
regex1.push("[A-Z]"); //Uppercase Alphabet.
regex2.push("[a-z]"); //Lowercase Alphabet.
regex3.push("[0-9]"); //Digit.
regex4.push("[!@@#$%^&*]"); //Special Character.
var thisVal =$(this).val();
if ($(this).val().length<6) {
$("#Length").removeClass("glyphicon glyphicon-ok").addClass("glyphicon glyphicon-remove");
}
for (var i = 0; i < regex1.length; i++) {
if (new RegExp(regex1[i]).test(!thisVal)) {
$("#UpperCase").removeClass("glyphicon glyphicon-ok").addClass("glyphicon glyphicon-remove");
}
}
for (var i = 0; i < regex2.length; i++) {
if (new RegExp(regex2[i]).test(!thisVal)) {
$("#LowerCase").removeClass("glyphicon glyphicon-ok").addClass("glyphicon glyphicon-remove");
}
}
for (var i = 0; i < regex3.length; i++) {
if (new RegExp(regex3[i]).test(!thisVal)) {
$("#Numbers").removeClass("glyphicon glyphicon-ok").addClass("glyphicon glyphicon-remove");
}
}
for (var i = 0; i < regex4.length; i++) {
if (new RegExp(regex4[i]).test(!thisVal)) {
$("#Symbols").removeClass("glyphicon glyphicon-ok").addClass("glyphicon glyphicon-remove");
}
}
});
}
</script>
注意:UpperCase,LowerCase,Numbers,Symbols是我给使用glyphicon remove图标的标签分配的ID名称。 如果我的代码没有完全起作用,那么我的问题可能会被视为重复问题。但是它部分地起作用,所以请告诉我是否有任何错误。 先行致谢。
DeletePassword()
函数来处理onkeydown
事件,那么为什么在函数内部又调用了keyup
?因为它已经在keydown
事件中被调用,所以不需要再次调用keyup
,除非有特殊需要。同样的情况也适用于EnterPassword()
函数。 - vikscoolkeydown
事件中涉及了keyup
事件。我看不出使用array
和loop
的可行性。简单的if
语句就可以完成任务。尽可能避免使用inline event handlers
。 - thskeydown
和keypress
事件分配给了函数,因此在函数内部不需要使用keyup
。但是,一旦我删除了删除和输入函数内的keyup
函数,事情就无法正常工作(即使是输入密码)。 - Riya