자바 스크립트 폼 검증
HTML 양식 유효성 검사는 자바 스크립트에 의해 수행 될 수있다.
양식 필드 (FNAME)이 비어있는 경우,이 함수는 메시지를 경고하고 제출되는 양식을 방지하기 위해 false를 반환합니다 :
자바 스크립트 예제
function validateForm() {
var
x = document.forms["myForm"]["fname"].value;
if (x == null || x == "") {
alert("Name must be filled out");
return false;
}
}양식이 제출 될 때 함수를 호출 할 수 있습니다 :
HTML 양식 예
<form name="myForm" action="demo_form.asp" onsubmit="return validateForm()"
method="post">
Name: <input type="text" name="fname">
<input type="submit" value="Submit">
</form> »그것을 자신을 시도 HTML 양식 유효성 검사
HTML 양식 유효성 검사는 브라우저에 의해 자동으로 수행 할 수 있습니다 :
양식 필드 경우 (fname) 비어의 required 속성은 제출되는 양식을 방지합니다 :
HTML 양식 예
<form action="demo_form.asp" method="post">
<input type="text" name="fname" required >
<input type="submit" value="Submit">
</form> »그것을 자신을 시도 자동 HTML 폼 검증은 인터넷 익스플로러 9 또는 이전 버전에서 작동하지 않습니다.
데이터 유효성 검사
데이터 유효성 검사는 컴퓨터 입력이 깨끗하고 정확하고 유용한 것을 보장하는 과정입니다.
일반적인 유효성 검사 작업은 다음과 같습니다 :
- 모든 필수 필드에 충전 된 사용자가?
- 사용자가 유효한 날짜를 입력 한?
- 사용자는 숫자 필드에 텍스트를 입력 한?
대부분의 경우, 데이터 검증의 목적은 컴퓨터 애플리케이션에 정확한 입력을 보장하는 것이다.
검증은 다양한 방법에 의해 정의되며, 여러 가지 방법으로 배치 될 수있다.
입력이 서버에 전송 한 후, 서버 측의 확인은, 웹 서버에 의해 수행된다.
입력은 웹 서버로 전송하기 전에 클라이언트 측의 검증은, 웹 브라우저에 의해 수행된다.
HTML 제약 조건 확인
HTML5는 제약 검증라는 새로운 HTML 유효성 검사 개념을 도입했다.
HTML 제약 검증을 기반으로합니다 :
- 제약 검증 HTML 입력 특성
- 제약 검증 CSS 의사 선택기
- 제약 검증 DOM 속성 및 메서드
제약 검증 HTML 입력 특성
| 속성 | 기술 |
|---|---|
| disabled | 입력 요소를 사용하지 않도록 지정 |
| max | 입력 요소의 최대 값을 지정 |
| min | 입력 요소의 최소값을 지정 |
| pattern | 입력 요소의 값의 패턴을 지정 |
| required | 입력 필드 요소를 필요로 지정 |
| type | 입력 요소의 유형을 지정 |
전체 목록으로 이동 HTML 입력 속성 .
제약 검증 CSS 의사 선택기
| 선택자 | 기술 |
|---|---|
| :disabled | 지정된 "장애인"속성으로 입력 요소를 선택합니다 |
| :invalid | 잘못된 값을 입력 요소를 선택합니다 |
| :optional | 지정하지 않고 "필요"속성으로 입력 요소를 선택합니다 |
| :required | 지정된 "필수"속성으로 입력 요소를 선택합니다 |
| :valid | 유효한 값을 입력 요소를 선택합니다 |
전체 목록은있어 의사 클래스 CSS .