input replace 유효성 체크

Javascript를 이용한 input value 유효성 검사. value 입력 시 다음 칸으로 focus() 된다. HTML 인증번호 4자리 입력 잘못된 인증번호 입니다! JS /* signup */ $(function(){ $(document).on('keypress keyup keydown', 'input[onlyNumber]', function(e){ console.log(e.which); if(/[a-z|ㄱ-ㅎ|ㅏ-ㅣ|가-힣]/g.test(this.value)){ //한글 막기 e.preventDefault(); this.value = ''; }else if (e.which != 8 && e.which != 0 //영문 e막기 && e.which 57 //숫자키만..

2022.05.03

input 태그의 pattern 속성과 정규표현식

HTML5에서 새롭게 추가된 속성입니다. 태그의 pattern 속성은 폼 제출 시 요소의 값을 검사할 때 사용될 정규 표현식(regular expression)을 명시합니다. 이때 전역 속성인 title 속성을 사용하여 정규 표현식에 간단한 설명을 추가함으로써 사용자가 정확한 값을 입력할 수 있도록 도움을 줄 수 있습니다. 보안상 예상치 않은 데이터 입력을 완전하게 컨트롤 하기 위해서는 최종적으로 서버사이드 스크립트에서 처리해 주어야 한다. pattern 속성이 제대로 동작하는 요소의 type 속성값은 다음과 같습니다. date, email, password, search, tel, text, url 문법 예제 생년월일: 예제

2022.05.02

HTML5 새로운 폼 요소

1. input 요소 HTML5 에서는 강력한 form 속성을 지원한다. 때문에 어려운 스크립트 없이도 다양한 ui를 표현할 수 있다. 이메일 입력을 위한 email 리소스 주소 입력을 위한 url 일정한 범위의 숫자를 입력받기 위한 number * min - 범위의 최소 값 * max - 범위의 최대 값 * step - 벙뮈 이동의 크기 일정한 범위의 숫자를 입력받기 위한 range * min - 범위의 최소 값 * max - 범위의 최대 값 * step - 벙뮈 이동의 크기 날짜를 입력받기 위한 date 검색을 위한 search 전화번호 입력을 위한 tel 색상 입력을 위한 color 2. output요소 output 요소는 사용자가 입력을 받기 위한 요소가 아니라 서식에서 출역용으로 사용하는 요소이..

2021.11.11