이 글에서는 정규식을 사용하여 JavaScript에서 양식의 유효성을 검사하는 방법(코드 예제)을 소개합니다. 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.
이전 글에서 [js의 양식에서 간단한 비밀번호 확인을 수행하는 방법은 무엇입니까? ] 이 글에서는 예제를 통해 양식을 검증하는 보다 포괄적인 방법을 소개합니다. 확인하고 싶은 모든 것을 확인하지만 각 요구 사항을 개별적으로 테스트하고 다양한 오류 메시지를 표시하기 위해 많은 코드를 사용합니다.
적은 양의 코드로 효과를 얻는 방법은 무엇입니까? 아마 많은 분들이 이런 질문을 하실 거라 믿습니다. 사실, 정규식을 사용하면 이 문제도 간단하게 해결할 수 있습니다.
양식의 비밀번호 확인을 통해 양식의 자바스크립트 정규식 확인 방법을 살펴보겠습니다.
HTML 코드:
<form method="POST" action="" onsubmit="return checkForm(this);"> <p>密 码: <input type="password" name="pwd1"><span> </p> <p>确认密码: <input type="password" name="pwd2"></p> <p><input type="submit"></p> </form>
js checkForm() 함수를 사용하여 비밀번호 확인, 정규식 호출:
function checkForm(form) { if(form.pwd1.value != "" && form.pwd1.value == form.pwd2.value) { if(!checkPassword(form.pwd1.value)) { alert("您输入的密码无效!"); form.pwd1.focus(); return false; } } else { alert("错误:请检查您输入并确认您的密码!"); form.pwd1.focus(); return false; } return true; }
js 정규식:
function checkPassword(str) { var re = /(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{6,}/; return re.test(str); }
효과, 비밀번호 입력(123456):
여기에 사용된 표현식 유형은 "미래" 부분에 포함된 정규 표현식을 일치시키려는 "미래"라고 합니다.
번역(위 정규 표현식으로 구현된 함수):
1. 6자 이상의 문자열을 일치시킵니다.
2. 최소 하나의 숫자를 포함합니다(d는
).3. 소문자 1개 이상
4. 대문자 1개 이상
테스트해 보세요.
비밀번호를 문자와 숫자로만 제한하려면(공백이나 기타 문자 없음) 조금만 바꾸세요. 와일드카드 w를 사용하면 다음을 완성할 수 있습니다.
개선된 정규 표현식:
function checkPassword(str) { var re = /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])\w{6,}$/; return re.test(str); }
W는 "모든 문자, 숫자 또는 밑줄"의 약어입니다.
구두점과 기타 기호는 추가 보안을 제공하므로 실제로 사용되는 문자를 제한하는 것은 좋은 습관이 아닙니다.
정규식 유효성 검사 양식의 예:
html 코드:
<form method="POST" action="" onsubmit="return checkForm(this);"> <p> 用 户 名: <input type="text" name="username"><span> (输入必须只包含字母、数字和下划线)</span></p> <p> 密 码: <input type="password" name="pwd1"><span> (输入必须包含至少一个数字/小写/大写字母,并且长度至少为六个字符)</span></p> <p>确认密码: <input type="password" name="pwd2"></p> <p><input type="submit"></p> </form>
js 코드:
function checkPassword(str) { var re = /(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{6,}/; return re.test(str); } function checkForm(form) { if(form.username.value == "") { alert("Error: Username cannot be blank!"); form.username.focus(); return false; } re = /^\w+$/; if(!re.test(form.username.value)) { alert("错误:用户名必须只包含字母、数字和下划线!"); form.username.focus(); return false; } if(form.pwd1.value != "" && form.pwd1.value == form.pwd2.value) { if(!checkPassword(form.pwd1.value)) { alert("您输入的密码无效!"); form.pwd1.focus(); return false; } } else { alert("错误:请检查您输入并确认您的密码!"); form.pwd1.focus(); return false; } return true; }
완료되었습니다!
렌더링:
요약: 보시다시피 정규식은 배울 가치가 매우 높습니다. JavaScript뿐만 아니라 PHP, Perl, Java 및 기타 여러 언어에서도 사용할 수 있습니다. vi뿐만 아니라 일부 텍스트 편집기에서도 텍스트를 검색하거나 바꿀 때 이를 허용합니다.
위 내용은 javascript는 정규식을 사용하여 양식의 유효성을 검사하는 방법은 무엇입니까? (코드 예)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!