JavaScript

[js] JS - 숫자만 입력 가능

방법1 - 간단 구현

 

<input type="number" onkeyup="num(this)">


<script>

function num(obj) {

    obj.value = obj.value.replace(/\D/g, '');

}

</script>


결과보기

슈와이 님 (181219) https://sir.kr/qa/281599

 

방법2 - 복잡 구현

 

<script type="text/javascript">

function onlyNumber(event){

    event = event || window.event;

    var keyID = (event.which) ? event.which : event.keyCode;

    if ( (keyID >= 48 && keyID <= 57) || (keyID >= 96 && keyID <= 105) || keyID == 8 || keyID == 46 || keyID == 37 || keyID == 39 ) 

        return;

    else

        return false;

}

function removeChar(event) {

    event = event || window.event;

    var keyID = (event.which) ? event.which : event.keyCode;

    if ( keyID == 8 || keyID == 46 || keyID == 37 || keyID == 39 ) 

        return;

    else

        event.target.value = event.target.value.replace(/[^0-9]/g, "");

}

</script>



<input type="number" pattern="[0-9]*" placeholder="숫자만 입력"  onkeydown="return onlyNumber(event)" onkeyup="removeChar(event)" style="ime-mode:disabled;">

 

결과보기

웹스킬 님 (날짜미상) http://webskills.kr/archives/310


분류 제목
DOM_Style JS - imageOrientation -
DOM_Style JS - isolation -
DOM_Style JS - justifyContent 속성 - flex 항목 세로 정렬 설정/반환 (= justifyConte…
DOM_Style JS - left 속성 - 왼쪽기준 (= left속성 = 좌측기준 = 레프트속성, 상속 X)
DOM_Style JS - letterSpacing 속성 ★ - 글자 간격 반환/설정 ( 텍스트사이띄우기 = 문자 간격 = 글…
DOM_Style JS - lineHeight 속성 ★ - 텍스트라인높이 (= line-height속성 = 텍스트줄높이 = 글…
DOM_Style JS - listStyle -
DOM_Style JS - listStyleImage -
DOM_Style JS - listStylePosition -
DOM_Style JS - listStyleType 속성 - 리스트 마커 모양 (= listStyleType속성 / 리스트스타…
DOM_Style JS - margin -
DOM_Style JS - marginBottom -
DOM_Style JS - marginLeft -
DOM_Style JS - marginRight -
DOM_Style JS - marginTop -
63/89
목록
 홈  PC버전 로그인 일본어
그누앞단언어
그누뒷단언어
그외코딩언어
그누보드
제작의뢰
Q&A
커뮤니티
웹유틸
회원센터
홈짱닷컴 PC버전 로그인