【问题标题】:length property in javascript not working properlyjavascript中的长度属性无法正常工作
【发布时间】:2013-02-15 15:34:16
【问题描述】:

我想限制用户输入 6-20 个字符范围内的密码。但下面的功能无法正常工作。

 function validatePass(pwd1, pwd2)
 {
var len = document.getElementById('pwd1').value;
if(len.length < 6 || len.length > 20)
{ pwd1.setCustomValidity('Enter 6-20 characters');
}
else if (pwd1.value != pwd2.value || pwd1.value == '' || pwd2.value == '' )
{
        pwd2.setCustomValidity('Password incorrect');
  } 
else 
{
    pwd2.setCustomValidity('');
}
}

html代码为:

<h4>Password</h4></td>
<td><input type="password" name="pwd1" size="30" id="pwd1" required placeholder="Enter 6-20 characters"></td></tr>
<tr><td>
<h4>Confirm Password</h4></td>
<td><input type="password" name="pwd2" id="pwd2" size="30" required onfocus="validatePass(document.getElementById('pwd1'), this);" oninput="validatePass(document.getElementById('pwd1'), this);">
</td></tr>

【问题讨论】:

  • 不使用为什么还要发pwd1?什么不能正常工作?会发生什么?
  • 有点奇怪 pwd1.value != pwd2.value || pwd1.value == '' || pwd2.value == '' 因为如果 pwd1 和 pwd2 可能不相等,为什么还要检查两者是否为空?
  • @Bandye,这段代码唯一困扰你的事情......?
  • @gdoron 不,不是唯一的......这只是一个评论......

标签: javascript html


【解决方案1】:

在 HTML5 中,可以使用pattern 属性:

<input type="password" pattern=".{6,20}" name="pwd1" size="30" id="pwd1" required placeholder="Enter 6-20 characters"></td></tr>

【讨论】:

    【解决方案2】:

    尝试使用这样的正则表达式:

    ^(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9]).{6,20}$
    

    来源:.NET RegEx to validate password between 6 and 20 characters with at least one upper case letter, one lower case letter and one digit

    这是一个完整的例子:

    function CheckPassword(inputtxt) 
    { 
    var passw = /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{6,20}$/;
    if(inputtxt.value.match(passw)) 
    { 
    alert('Correct, try another...')
    return true;
    }
    else
    { 
    alert('Wrong...!')
    return false;
    }
    }
    

    来源:http://www.w3resource.com/javascript/form/password-validation.php

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2010-11-07
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多