我不确定我是否误解了 True/False 在 Javascript 中的工作方式。 在我下面的 Jquery 脚本中,我将 6 个变量声明为 false。 如果正则表达式验证条件良好,那么我将变量重新声明为 true。 底部是一个简单的 alert(),它会在所有变量都为真时告诉我。
验证条件有效(删除/添加类),但未显示警报。这就是为什么我不确定我是否弄乱了真/假部分。
$('#password1').keyup(function() {
var checkLength = false;
var checkLetter = false;
var checkCaps = false;
var checkNum = false;
var checkSymbol = false;
var checkSpace = false;
var pswd = $(this).val();
//validate the length
if(pswd.length < 6 ){
$('#length').removeClass('valid').addClass('invalid');
}else{
$('#length').removeClass('invalid').addClass('valid');
checkLength = true;
}
//validate letter
if(pswd.match(/[A-Za-z]/)){
$('#letter').removeClass('invalid').addClass('valid');
}else{
$('#letter').removeClass('valid').addClass('invalid');
checkLetter = true;
}
//validate capital letter
if(pswd.match(/[A-Z]/)){
$('#capital').removeClass('invalid').addClass('valid');
}else{
$('#capital').removeClass('valid').addClass('invalid');
checkCaps = true;
}
//validate number
if(pswd.match(/\d/)){
$('#number').removeClass('invalid').addClass('valid');
}else{
$('#number').removeClass('valid').addClass('invalid');
checkNum = true;
}
//validate symbols
if(pswd.match(/[^a-zA-Z0-9]/)){
$('#symbol').removeClass('invalid').addClass('valid');
}else{
$('#symbol').removeClass('valid').addClass('invalid');
checkSymbol = true;
}
//validate no spaces
if(pswd.match(/\s/)){
$('#spaces').removeClass('valid').addClass('invalid');
}else{
$('#spaces').removeClass('invalid').addClass('valid');
checkSpace = true;
}
// here is where I'm concerned I'm wrong
if(checkLength == true && checkLetter == true && checkCaps == true && checkNum == true && checkSymbol == true && checkSpace == true){
alert("All good");
}
});
有人会仔细检查我吗?
最佳答案
一开始不用写checkLength == true
,checkLength
就够了,都是boolean变量。
其次,在您的某些情况下,您分配类 invalid
但将 var 设置为 true,而在其他情况下,反之亦然。每个 check... = true
都应该在与 class = valid
相同的分支中。
另外,就我个人而言,我会调整有效性条件,将所有积极事件都放在 if
或 else
分支中,但不会像您目前所做的那样混合。
最后,我总是尽量避免重复代码。有很多地方可以重构,但您可以从在单独的函数中设置类开始。
看看它的工作 in this fiddle .
$('#password1').keyup(function() {
var checkLength = false;
var checkLetter = false;
var checkCaps = false;
var checkNum = false;
var checkSymbol = false;
var checkSpace = false;
var pswd = $(this).val();
//validate the length
// reverse the condition, to have the valid state in the if branch as well
if(pswd.length >= 6 ){
setValid('#length');
checkLength = true;
}else{
setInvalid('#length');
}
//validate letter
if(pswd.match(/[A-Za-z]/)){
setValid('#letter');
checkLetter = true;
}else{
setInvalid('#letter');
}
//validate capital letter
if(pswd.match(/[A-Z]/)){
setValid('#capital');
checkCaps = true;
}else{
setInvalid('#capital');
}
//validate number
if(pswd.match(/\d/)){
setValid('#number');
checkNum = true;
}else{
setInvalid('#number');
}
//validate symbols
if(pswd.match(/[^a-zA-Z0-9]/)){
setValid('#symbol');
checkSymbol = true;
}else{
setInvalid('#symbol');
}
//validate no spaces
if(!pswd.match(/\s/)){
setValid('#spaces');
checkSpace = true;
}else{
setInvalid('#spaces');
}
function setValid(e){$(e).removeClass('invalid').addClass('valid')}
function setInvalid(e){$(e).removeClass('valid').addClass('invalid')}
if(checkLength && checkLetter && checkCaps && checkNum && checkSymbol && checkSpace){
alert("All good");
}
console.log("keyup");
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="password1" type="text">
关于javascript 如果变量为真,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11867754/