개발자의 끄적끄적

[javascript/jquery] input type number 에서 숫자만 입력받게 하는 방법  html 에서  아래와 같이 숫자만 입력 받기 위해서 number 타입으로 선언해서 사용하고는 합니다! 하지만! 위와 같이 타입을 지정하면 숫자만 입력되는거 같아 보이지만, e, +, - 도 입력이 가능합니다! 그럴때는 onkeypress 나 onkeydown 속성을 추가해서 아래 함수를 이용해 정규식으로 숫자만 남게 처리하시면 됩니다! function num_only() { var reg = /[^0-9]/g; string = string.replace(reg, ""); return string;} 참고들 하세요!

[html/css] html input onsearch event example input onsearch 이벤트 예제 html 에서 input 태그를 사용하다보면 태그에 내용 입력시 x 버튼이 활성화되고 x 버튼 클릭시 입력되었던 내용을 사라지게 처리하곤 합니다. 그중에서 실제 서버와 검색을 연동하다보면 x 버튼 클릭시에도 이벤트를 받아서 원래 초기 목록을 가져와야 하는 경우가 종종 있습니다. 그럴때는 아래와 같이 onsearch 이벤트를 이용하시면 됩니다! 참고들 하세요!

[html/css] html ios input 숫자 키패드 띄우는 방법 ios 에서 특정 값을 입력받을때 숫자키패드를 띄워야 하는 경우가 있습니다. 그럴때는 아래 속성 2가지를 input 태그에 추가해주시면 됩니다. inputmode="numeric" pattern="[0-9]*" 위 내용을 input 에 추가하면 아래와 같이 됩니다! 참고들 하세요!

[html/css] html input enter no submit example / html input 엔터 submit 막는 방법 form 데이터로 입력을 받아서 서버로 전송하기 위해서 엔터키를 입력하면 특정 함수를 호출하도록 작업을 하곤 합니다. 그런데 특정경우에는 엔터키를 제어하는데 무조건 submit 이 되어 버리는 현상이 있습니다! 그럴때는 아래 속성을 form 태그에 추가해주시면 됩니다! onsubmit="return false" 위 내용을 추가하면 form 태그는 아래와 같은 모습일 껍니다! 참고들 하세요!

[html/css] html input disable autocomplete example / html input 자동완성 비활성 설정 방법 html 에서 input type text 를 이용해서 데이터를 입력받다 보면 사용자의 브라우저 환경에 따라서 자동완성 기능이 활성화됩니다! 그럴때는 아래 나와있는 내용처럼 autocomplete 옵션을 이용하여 제어할 수 있습니다. 위 내용을 보시면 아시겠지만, autocompltet 옵션값을 no 로 설정하여 자동완성을 비활성화 하는 내용입니다! 참고들 하세요!

[html/css] html input tag 영문 입력 우선 설정 방법 html input 태그에서 영문 입력을 우선으로 설정하고 싶은 경우가 종종 있습니다. 그럴때는 한글입력 우선과 동일하게 style 에 ime-mode 를 추가하시면 됩니다. 위에 나와있는 내용처럼 ime-mode 을 inactive 로 추가하면 영문입력을 우선으로 설정할 수 있습니다! 한글과 동일하고 active / inactive 만 다릅니다! 참고들 하세요!

[html/css] html input 초기값 한글 설정 방법 html 에서 input 태그로 구현된 입력창을 한글키보드가 우선 선택되게 설정해야 하는 경우가 있습니다! 그럴때는 ime-mode 라는것을 사용하시면 됩니다. 위 내용보시면 아시겠지만, style 에 ime-mode:active 를 추가하시면 됩니다! 참고들 하세요!

[html/css] html input number only example / html input 숫자만 입력받도록 설정하는 방법 html 에서 input 태그를 이용해서 입력창을 만들다보면, 숫자만 입력해야하는 경우가 있습니다! 그럴때는 아래처럼 input type 을 number 로 선언하시면 됩니다! 위처럼 선언하면 input 에 숫자만 입력이 가능하고, 위 아래 숫자를 늘리고 줄일수 있는 버튼이 생성됩니다! 그래도 정확히 숫자만 입력받기 위해서는 onkeyup 이나 onkeypress 같은 이벤트를 받아서 체크하는게 정확합니다! 참고들 하세요!