input 검색 결과
3 개의 검색 결과가 있습니다.
JavaScript

input type="text" 에 숫자만 입력 받기

input 태그에 type 설정을 'number' 로 하지 않고 'text' 인 상태에서 간략하게 숫자만 입력받고 싶은 경우에 다음과 같이 자바스크립트 함수로 만들어 두고 function onlyNumber(obj){ obj.value = obj.value.replace(/[^0-9]/g, ""); } input 태그에 'oninput' 속성(input 태그에 값이 입력될때 실행)에 함수 호출하여 제어 * 주의사항 값이 입력이 될 때마다('oninput' 속성) 자바스크립트 함수로 값을 제어하는 방법이고, intput 태그의 속성이 'text' 이면 근본적으로 숫자뿐만 아니라 문자 및 특수기호 등이 입력가능 하기 때문에 개발자도구 등을 이용하여 태그에 'value' 속성에 강제로 값을 삽입할 수 있으므로..

2023. 1. 29. 15:45
JavaScript

JS / 제이쿼리 여러 체크박스(input 태그) 중 현재 체크된 체크박스 (input 태그) 값 가져오기

쇼핑몰또는 기타 서비스에서 클라이언트(사용자)로 부터 특정 값을 입력 받는 화면은 대부분 사용되고 있다. 그중 여러 선택지를 주고 하나를 고르게 하는 형태로 input 태그의 체크박스 형식을 자주 사용하게 되는데 클라이언트(사용자)에 의해 체크된 값을 저장하기 위해 우선 값을 가져와야 하는 경우가 있는데 아래와 같이 구현 가능하다. $("input[name=sauce]:checked").val() input 태그의 'name' 속성을 이용한 것인데, 보통 여러 체크박스 선택지는 하나의 주제로 묶인다. 그래서 각 input 태그의 name을 동일하게 설정한 후 위 처럼 제이쿼리를 사용해서 input 태그의 (name이 sauce 라고 가정) name이 sauce인 태그들 중 체크된(:checked) 값을 ..

2022. 8. 15. 09:53
HTML , CSS

HTML input 태그 date 타입 날짜(달력) 입력 max 속성을 통한 연도 4자리 제한

날짜 정보를 입력받는 화면에서 input 태그에 type을 date 로 사용하여 구현하는 경우가 있는데 입력 창에서 연도 값을 타이핑 하다 보면 6자리 까지 입력이 되는 것을 확인할 수 있다. 물론 데이터를 넘기기 전에 자바스크립트를 통해 유효성 체크를 별도로 할 수 있지만 입력 자체를 4자리로 제한 하는 것이 깔끔할 수 있겠다는 생각이 든다. 그럴 경우 간단하게 태그의 속성 값으로 제어할 수 있을 듯 하다. input 태그에 max 속성을 주는데, 값을 위 이미지 처럼 설정 해주면 연도는 4자리를 넘어가게 되면 다음 월 입력 칸으로 넘어가게 된다 이후 입력 값에 대해서는 자바스크립트를 통해 유효성을 체크한 뒤 DB와 통신하면 될 것 같다.

2022. 7. 10. 13:30