注册验证(简单,jquery)

来源:互联网 发布:win7 64系统优化 编辑:程序博客网 时间:2024/06/07 23:32
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Document</title></head><body><form action="">用户名:<input type="text" name="uname"><span></span><br>密码:<input type="password" name="upwd"><span></span><br><input type="submit" value="提交注册信息"></form><script src="js/jquery.min.js"></script><script>var $txtName=$("form>input[name=uname]"),    $txtPwd=$("form>input[name=upwd]"),    msgs={    nameErr:"用户名必须介于3~9位之间!",    pwdErr:"密码必须介于6~8位之间!"    };$txtName.blur(e=>{vali($(e.target),3,9,msgs.nameErr);//这里还可以加其他验证});$txtPwd.blur(e=>{vali($(e.target),6,8,msgs.pwdErr);});$("form").submit(e=>{if(!vali($txtName,3,9,msgs.nameErr)){e.preventDefault();}else if(!vali($txtPwd,6,8,msgs.pwdErr)){e.preventDefault();}})function vali($txt,minLen,maxLen,msg){var len=$txt.val().trim().length;var $span=$txt.next();if(len>=minLen&&len<=maxLen){$span.html("<img src='img/ok.png'>");return true;}else{$span.html("<img src='img/err.png'>"+msg);return false;}}</script></body></html>

原创粉丝点击