[英]Hide the Tool tip popup after all condition are fulfilled
I have a jquery password live validation form HERE 我在这里有一个jquery密码实时验证表
This example guides to add proper password and show with red and green sign. 此示例指导添加正确的密码并显示红色和绿色标志。
But I am wanting something like when all the conditions of password are successful then popup tool tip will automatically disappear. 但我想要的是,当所有密码条件成功时,弹出工具提示将自动消失。
How can this possible. 怎么可能呢。 I am not good at jquery, any help will be much appreciated.
我不擅长jquery,任何帮助将不胜感激。
JS JS
$(document).ready(function() {
$('input[type=password]').keyup(function() {
// set password variable
var pswd = $(this).val();
if ( pswd.length < 8 ) {
$('#length').removeClass('valid').addClass('invalid');
} else {
$('#length').removeClass('invalid').addClass('valid');
}
//validate letter
if ( pswd.match(/[A-z]/) ) {
$('#letter').removeClass('invalid').addClass('valid');
} else {
$('#letter').removeClass('valid').addClass('invalid');
}
//validate capital letter
if ( pswd.match(/[A-Z]/) ) {
$('#capital').removeClass('invalid').addClass('valid');
} else {
$('#capital').removeClass('valid').addClass('invalid');
}
//validate number
if ( pswd.match(/\d/) ) {
$('#number').removeClass('invalid').addClass('valid');
} else {
$('#number').removeClass('valid').addClass('invalid');
}
});
$('input[type=password]').focus(function() {
// focus code here
});
$('input[type=password]').blur(function() {
// blur code here
});
$('input[type=password]').keyup(function() {
// keyup code here
}).focus(function() {
$('#pswd_info').show();
}).blur(function() {
$('#pswd_info').hide();
});
});
One way would be to count the number of valid rules and when you reach the appropriate number, fade the rules out: 一种方法是计算有效规则的数量,当您达到相应的数字时,将规则淡出:
if ($('#pswd_info li.valid').length == 4) $('#pswd_info').fadeOut();
Here is a working version ( jsfiddle ): 这是一个工作版本( jsfiddle ):
$(document).ready(function() {
$('input[type=password]').keyup(function() {
var isValid = true;
// set password variable
var pswd = $(this).val();
if ( pswd.length < 8 ) {
isValid &= false;
$('#length').removeClass('valid').addClass('invalid');
} else {
isValid &= true;
$('#length').removeClass('invalid').addClass('valid');
}
//validate letter
if ( pswd.match(/[A-z]/) ) {
isValid &= true;
$('#letter').removeClass('invalid').addClass('valid');
} else {
isValid &= false;
$('#letter').removeClass('valid').addClass('invalid');
}
//validate capital letter
if ( pswd.match(/[A-Z]/) ) {
isValid &= true;
$('#capital').removeClass('invalid').addClass('valid');
} else {
isValid &= false;
$('#capital').removeClass('valid').addClass('invalid');
}
//validate number
if ( pswd.match(/\d/) ) {
isValid &= true;
$('#number').removeClass('invalid').addClass('valid');
} else {
isValid &= false;
$('#number').removeClass('valid').addClass('invalid');
}
if(isValid){
$('#pswd_info').hide();
}
});
$('input[type=password]').focus(function() {
// focus code here
});
$('input[type=password]').blur(function() {
// blur code here
});
$('input[type=password]').keyup(function() {
// keyup code here
}).focus(function() {
$('#pswd_info').show();
}).blur(function() {
$('#pswd_info').hide();
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.