2017-09-04 2 views

답변

0

HTML의 유효성 검사와 양식 제출의 유효성 검사.

HTML

<input name="numbers" type="text" maxlength="9" size="20" pattern="^\d{9}$" placeholder="9 digits only" /> 

이, 9 개 문자 입력을 제한하는 패턴이 해당이 잘못된 경우 빨간색 입력 영역 바뀝니다 9 자리 숫자와 일치 할 수 있고, 사용자에게 경고하는 자리 표시 자 텍스트를 추가합니다.

const button = document.querySelector('button'); 
button.addEventListener('click', formHandler, false); 

function formHandler(e) { 

    // Don't submit the form yet 
    e.preventDefault(); 

    // Grab the form 
    const form = document.forms[0]; 

    // Use the same regex as in the HTML to test the input value 
    if (/^\d{9}$/.test(form.numbers.value)) { 
    console.log('OK') // form.submit() ? 
    } else { 
    console.log('Fail') 
    } 
} 

DEMO

: 예를 들어 자바 스크립트

이 전에 제출 양식에 입력을 확인하는 간단한 버튼을 사용