추천 도서: Javascript 양식 유효성 검사 길이
Javascript 양식 유효성 검사 - 정규식 첫 소개
JavaScript를 사용하면 데이터가 서버로 전송되기 전에 HTML 양식의 입력 데이터를 확인할 수 있습니다.
양식을 제출하기 전에 데이터의 합법성을 확인하세요
양식의 데이터를 확인하려면 getElementById()를 사용하여 웹페이지의 모든 요소에 액세스할 수 있습니다
각 양식 필드에는 양식 데이터를 확인하는 모든 함수에 전달할 수 있는 양식 개체가 있습니다
<input id="zipcode" name="zipcode" type="text" size="5" onclick="showIt(this.form)"/> function showIt(thisForm) { alert(thisForm["zipcode"].value); //通过form对象的name属性,取得元素的值 }
name 속성이나 getElementById() 메소드를 사용하여 요소를 얻을 수 있습니다
양식 데이터를 확인하는 시점은 처리할 올바른 사용자 입력 이벤트를 선택하는 것에 따라 달라집니다.
즉, 사용자가 데이터를 입력하는 즉시 데이터가 검증됩니다.
사용자가 데이터를 입력하는 순서는 다음과 같습니다.
입력 필드 선택
필드에 데이터를 입력하세요
이 지역을 떠나 다음 목표로 이동
다음 대상 도메인 선택
필드에 데이터를 입력하세요
이 과정에서 일련의 이벤트가 발생하며, 이러한 이벤트를 통해 데이터를 확인할 수 있는 기회를 찾을 수 있습니다
1) 입력 필드를 선택하면 onfocus 이벤트(focus)가 발생합니다
2) 입력 필드를 벗어날 때 – onblur 이벤트 발생(포커스 이탈)
3) 도메인을 떠나 입력 내용이 변경되면 onchange 이벤트가 발생합니다
onblur 이벤트가 실행될 때 데이터를 확인하는 것이 가장 올바른 선택입니다
확인의 첫 번째 단계: 도메인이 비어 있지 않은지 확인
<input id="phone" name="phone" type="text" size="12" onblur="validateNonEmpty(this)"/>
onblur 이벤트에 응답하려면 verifyNonEmpty를 호출하세요
양식 개체는 this 키워드를 사용하여 함수에 전달됩니다
다음은 인증 기능입니다
function validateNonEmpty(inputField) { if(inputField.value.length==0) { alert("Please enter a value."); return false; } return true; }
웹 양식을 제출할 때 사용자가 입력한 데이터를 확인해야 합니다.
양식의 데이터를 확인하려면 getElementById()를 사용하여 웹페이지의 모든 요소에 액세스할 수 있습니다
위 내용은 Javascript 형식과 검증-비어있지 않은 검증에 대한 완전한 설명입니다. 모든 분들께 도움이 되길 바랍니다!