Wulin.com의 기사 소개 (www.vevb.com) : HTML5의 매우 간단한 양식 검증 방법은 IE 및 기타 오래된 브라우저로 가져옵니다.
제품 유형 : 동적 효과 (Dynamic JS, JQuery Works)
작업 설명 : HTML5의 매우 간단한 양식 검증 방법을 IE 및 기타 오래된 브라우저에 가져옵니다.
생산 아이디어 : 이전 브라우저가 HTML5 구문을 사용하여 확인을 표현할 수 있도록 플러그인을 작성하십시오. 맨 아래의 제출 이벤트를 가로 채고 jQuery를 사용하여 확인 규칙이 충족되지 않는 것을 발견 한 후 유효하지 않은 이벤트를 트리거해야합니다. 개발자는 이전에 매우 복잡한 양식 검증 기능을 완료하기 위해 유효하지 않은 이벤트를 단순히 바인딩하면됩니다.
나는 새로운 것을 좋아하는 프론트 엔드 ER이 HTML5의 양식 검증 기능을 시도했다고 생각합니다. <input>에 필요한 추가는 필요한 항목이됩니다.
채워진 형식을 강제하기 위해 패턴으로 정규 표현식을 작성하십시오. 여기 데모가 있습니다
<양식>
<입력 자리 표시 자 = 3-5 자리의 밑줄은 숫자와 문자 필수 패턴 =/w {3,5}로 채워야합니다.
<입력 유형 = 제출>
</form>
<스크립트 src => </script>
<script src = form.html5.js> </script>
<cript>
$ (입력) .Bind (무효, 함수 (e) {
경고 (부정확 한 경우 3-5 자리, 숫자, 문자의 밑줄을 작성해야합니다);
거짓을 반환합니다.
});
$ (html) .Submit (function (e) {
if (e.ispropagationStopped ()) {
반품;
}
경고 (양식이 성공적으로 제출 됨);
거짓을 반환합니다.
});
</스크립트>
매우 간단합니까? 우리가해야 할 일은 두 단계입니다
1. 검증 규칙을 정규 표현식으로 작성하고 입력 태그의 패턴 속성에 넣으십시오.
2. JQuery는 유효하지 않은 입력 이벤트를 가로 채 웁니다
이 두 단계를 완료하면 최신 브라우저에서 양식 검증을 완료 할 수 있습니다.
그러나 오래된 브라우저를 지원하는 방법은 무엇입니까? 한 줄의 코드를 추가하십시오
<script src = form.html5.js> </script>
동시에이 세 가지 파일을 다운로드하고 세 파일이 동일한 디렉토리에 있는지 확인해야합니다.
(select.htc의 목적은 양식 검증과 관련이 없습니다.)
다음 상황이 있으면 저에게 연락하여 답장을받을 수 있습니다.