HTML은 텍스트 입력은 숫자 만 입력 가능

해결법

1.참고 :이 업데이트 된 대답이다. 댓글은 아래의 키 코드 주위에 엉망이 이전 버전을 참조하십시오.

참고 :이 업데이트 된 대답이다. 댓글은 아래의 키 코드 주위에 엉망이 이전 버전을 참조하십시오.

JSFiddle에 직접보십시오.

당신은 지원이, 붙여 넣기 드래그 + 드롭, 키보드 단축키, 상황에 맞는 메뉴 조작, 비 typeable 키, 캐럿 위치, 다른 키보드 레이아웃, 그리고 모든 브라우저를 복사 + (다음과 같이 SetInputFilter 기능으로 텍스트 <입력>의 입력 값을 필터링 할 수 있습니다 ) IE 9 가입일 :

// Restricts input for the given textbox to the given inputFilter function.
function setInputFilter(textbox, inputFilter) {
  ["input", "keydown", "keyup", "mousedown", "mouseup", "select", "contextmenu", "drop"].forEach(function(event) {
    textbox.addEventListener(event, function() {
      if (inputFilter(this.value)) {
        this.oldValue = this.value;
        this.oldSelectionStart = this.selectionStart;
        this.oldSelectionEnd = this.selectionEnd;
      } else if (this.hasOwnProperty("oldValue")) {
        this.value = this.oldValue;
        this.setSelectionRange(this.oldSelectionStart, this.oldSelectionEnd);
      } else {
        this.value = "";
      }
    });
  });
}

이제 입력 필터를 설치합니다 같이 SetInputFilter 기능을 사용할 수 있습니다 :

setInputFilter(document.getElementById("myTextBox"), function(value) {
  return /^\d*\.?\d*$/.test(value); // Allow digits and '.' only, using a RegExp
});

이상의 입력 필터 예는 JSFiddle 데모를 참조하십시오. 또한 당신은 여전히 서버 측 유효성 검사를 수행해야합니다!

다음은이의 타이프 버전입니다.

function setInputFilter(textbox: Element, inputFilter: (value: string) => boolean): void {
    ["input", "keydown", "keyup", "mousedown", "mouseup", "select", "contextmenu", "drop"].forEach(function(event) {
        textbox.addEventListener(event, function(this: (HTMLInputElement | HTMLTextAreaElement) & {oldValue: string; oldSelectionStart: number | null, oldSelectionEnd: number | null}) {
            if (inputFilter(this.value)) {
                this.oldValue = this.value;
                this.oldSelectionStart = this.selectionStart;
                this.oldSelectionEnd = this.selectionEnd;
            } else if (Object.prototype.hasOwnProperty.call(this, 'oldValue')) {
                this.value = this.oldValue;
                if (this.oldSelectionStart !== null &&
                    this.oldSelectionEnd !== null) {
                    this.setSelectionRange(this.oldSelectionStart, this.oldSelectionEnd);
                }
            } else {
                this.value = "";
            }
        });
    });
}

이의의 jQuery 버전도 있습니다. 이 답변을 참조하십시오.

HTML 5는 <입력 유형 = "숫자"> (사양 참조)하지만, 브라우저 지원은 다양합니다 네이티브 솔루션을 제공합니다 :

w3schools.com에 직접보십시오.

2.이 DOM을 사용

이 DOM을 사용

<input type='text' onkeypress='validate(event)' />

그리고이 스크립트

function validate(evt) {
  var theEvent = evt || window.event;

  // Handle paste
  if (theEvent.type === 'paste') {
      key = event.clipboardData.getData('text/plain');
  } else {
  // Handle key press
      var key = theEvent.keyCode || theEvent.which;
      key = String.fromCharCode(key);
  }
  var regex = /[0-9]|\./;
  if( !regex.test(key) ) {
    theEvent.returnValue = false;
    if(theEvent.preventDefault) theEvent.preventDefault();
  }
}

3.나는이에 좋은 답변을 위해 오랫동안 열심히 검색 한, 우리는 필사적으로 <입력 유형 = "숫자"를 필요로하지만, 짧은 그,이 둘은 내가 가지고 올 수있는 가장 간결한의 방법은 다음과 같습니다

나는이에 좋은 답변을 위해 오랫동안 열심히 검색 한, 우리는 필사적으로 <입력 유형 = "숫자"를 필요로하지만, 짧은 그,이 둘은 내가 가지고 올 수있는 가장 간결한의 방법은 다음과 같습니다
```
<input type="text" 
       onkeyup="this.value=this.value.replace(/[^\d]/,'')">
```
당신이 순간적인 삭제되기 전에 게재가 비 승인 된 문자를 싫어하는 경우, 방법은 아래에있는 내 솔루션입니다. 수많은 추가 조건을 참고,이 탐색 및 단축키의 모든 종류를 사용하지 않도록하는 것입니다. 사람이를 compactify하는 방법을 알고있는 경우, 저희에게 알려주십시오!
```
<input type="text" 
onkeydown="return ( event.ctrlKey || event.altKey 
                    || (47<event.keyCode && event.keyCode<58 && event.shiftKey==false) 
                    || (95<event.keyCode && event.keyCode<106)
                    || (event.keyCode==8) || (event.keyCode==9) 
                    || (event.keyCode>34 && event.keyCode<40) 
                    || (event.keyCode==46) )">
```
4.여기에 더 이상 정확히 하나의 진수를 허용하지만, 간단한 하나입니다 :

여기에 더 이상 정확히 하나의 진수를 허용하지만, 간단한 하나입니다 :

= "this.value = this.value.replace (/ [^ 0-9.] / g '') oninput

5.나를 위해 좋은 작품 그리고 또 하나의 예 :

나를 위해 좋은 작품 그리고 또 하나의 예 :

function validateNumber(event) {
    var key = window.event ? event.keyCode : event.which;
    if (event.keyCode === 8 || event.keyCode === 46) {
        return true;
    } else if ( key < 48 || key > 57 ) {
        return false;
    } else {
        return true;
    }
};

또한 키 누르기 이벤트에 첨부

$(document).ready(function(){
    $('[id^=edit]').keypress(validateNumber);
});

그리고 HTML :

<input type="input" id="edit1" value="0" size="5" maxlength="5" />

여기 jsFiddle 예는

6.대부분의 대답은 여기에 모든 키 - 이벤트를 사용하는 약점을 가지고있다.

대부분의 대답은 여기에 모든 키 - 이벤트를 사용하는 약점을 가지고있다.

답변의 대부분은 붙여 더 원치 않는 행동 + 복사, 키보드 매크로 텍스트 선택을 할 수있는 능력을 제한하는 것, 다른 사람은 기관총으로 파리를 죽이고 특정의 jQuery 플러그인에 의존하는 것.

이 간단한 해결책은 (음성 - 텍스트 등을 오른쪽 클릭하면 복사 + 붙여 넣기, + 복사, 키 스트로크 붙여 넣기)에 관계없이 입력 메커니즘의 나 크로스 플랫폼을 위해 최선을 작동하는 것 같다. 모든 텍스트 선택 키보드 매크로는 심지어 스크립트에서 숫자가 아닌 값을 설정하는 사람의 능력을 제한 할 일 여전히 것이고,.
```
function forceNumeric(){
    var $input = $(this);
    $input.val($input.val().replace(/[^\d]+/g,''));
}
$('body').on('propertychange input', 'input[type="number"]', forceNumeric);
```
7.HTML5는 <입력 유형 = 수>, 당신을 위해 잘 들린다 있습니다. 현재, 오페라는 기본적으로 지원하지만, 자바 스크립트 구현이 프로젝트가있다.

HTML5는 <입력 유형 = 수>, 당신을 위해 잘 들린다 있습니다. 현재, 오페라는 기본적으로 지원하지만, 자바 스크립트 구현이 프로젝트가있다.
8.당신이 사용할 수 있도록 HTML5는 정규 표현식에를 지원합니다 :

당신이 사용할 수 있도록 HTML5는 정규 표현식에를 지원합니다 :
```
<input id="numbersOnly" pattern="[0-9.]+" type="text">
```
경고 : 일부 브라우저는 아직 지원하지 않습니다.
9.나는 여기에 언급 된 두 답변의 조합을 사용하기로 선택 즉,

나는 여기에 언급 된 두 답변의 조합을 사용하기로 선택 즉,

과
```
function isNumberKey(evt){
    var charCode = (evt.which) ? evt.which : evt.keyCode
    return !(charCode > 31 && (charCode < 48 || charCode > 57));
}
```

10.자바 스크립트

자바 스크립트

function validateNumber(evt) {
    var e = evt || window.event;
    var key = e.keyCode || e.which;

    if (!e.shiftKey && !e.altKey && !e.ctrlKey &&
    // numbers   
    key >= 48 && key <= 57 ||
    // Numeric keypad
    key >= 96 && key <= 105 ||
    // Backspace and Tab and Enter
    key == 8 || key == 9 || key == 13 ||
    // Home and End
    key == 35 || key == 36 ||
    // left and right arrows
    key == 37 || key == 39 ||
    // Del and Ins
    key == 46 || key == 45) {
        // input is VALID
    }
    else {
        // input is INVALID
        e.returnValue = false;
        if (e.preventDefault) e.preventDefault();
    }
}

당신이 쉼표, 마침표 및 마이너스를 추가 할 수 있습니다 추가 (, .-)

  // comma, period and minus, . on keypad
  key == 190 || key == 188 || key == 109 || key == 110 ||

HTML

<input type="text" onkeydown="validateNumber(event);"/ >

11.그래서 간단 ....

그래서 간단 ....

// 자바 스크립트 함수에서 (HTML이나 PHP를 사용할 수 있습니다).

function isNumberKey(evt){
    var charCode = (evt.which) ? evt.which : evt.keyCode;
    if (charCode > 31 && (charCode < 48 || charCode > 57))
        return false;
    return true;
}

양식 입력의 경우 :

<input type=text name=form_number size=20 maxlength=12 onkeypress='return isNumberKey(event)'>

최대 입력으로. (이러한 위는 12 자리 숫자 가능)

12.이 개 솔루션 :

이 개 솔루션 :

(jQuery를 검증 플러그인 예를 들어) 양식 유효성 검사기를 사용하여

정규 표현식으로 입력 필드의 이벤트 (사용자가 필드 단풍 즉, 경우)에 onblur 동안 검사를 수행합니다 :
```
<script type="text/javascript">
function testField(field) {
    var regExpr = new RegExp("^\d*\.?\d*$");
    if (!regExpr.test(field.value)) {
      // Case of error
      field.value = "";
    }
}

</script>

<input type="text" ... onblur="testField(this);"/>
```
13.더 안전한 방식 대신 키 누름을 하이재킹 필터 키 코드하려고 노력 입력의 값을 확인한다.

더 안전한 방식 대신 키 누름을 하이재킹 필터 키 코드하려고 노력 입력의 값을 확인한다.

사용자가 사용하는 키보드의 화살표에 무료로이 방법은, 수정 키, 백 스페이스, 삭제, 사용 드래그 앤 드롭 텍스트, 심지어 사용 접근성 입력을 붙여 비표준 keyboars, 사용 마우스를 사용합니다.

아래 스크립트는 양수와 음수를 할 수 있습니다
```
1
10
100.0
100.01
-1
-1.0
-10.00
1.0.0 //not allowed
```
VAR = document.getElementById를 입력 ( '횟수'); input.onkeyup = input.onchange = enforceFloat; // 만 플로트 inputed 될 수 있음을 시행 enforceFloat 함수 () { VAR 유효 = /^\-?\d+\.\d*$|^\-?[\d]*$/을; VAR 번호 /\-\d+\.\d*|\-[\d]*|[\d]+\.[\d]*|[\d]+/ =; 만약 (! valid.test (this.value)) { VAR N = this.value.match (번호); this.value = N? N [0] ''; } } <입력 ID = "숫자"값 = "- 3.1415"자리 = "숫자 입력"오토 포커스>

편집 : 나는 지금 구식 생각 때문에 나는 나의 오래된 대답을 제거했다.
14.당신은 이것에 대한 패턴을 사용할 수 있습니다 :

당신은 이것에 대한 패턴을 사용할 수 있습니다 :
```
<input id="numbers" pattern="[0-9.]+" type="number">
```
여기에서 완전한 모바일 웹 사이트 인터페이스 도움말을 볼 수 있습니다.
15.상술 한 솔루션을 검색 할 수 있습니다. 이 사용자는 숫자 값을 입력 할 수 있습니다에서, 또한 사용자가 복사, 붙여 넣기, 드래그를 입력 드롭 할 수 없습니다.

상술 한 솔루션을 검색 할 수 있습니다. 이 사용자는 숫자 값을 입력 할 수 있습니다에서, 또한 사용자가 복사, 붙여 넣기, 드래그를 입력 드롭 할 수 없습니다.
```
0,1,2,3,4,5,6,7,8,9
```
$ (문서) .ready (함수 () { $ ( '# 번호'). 바인드 (함수 (예 "컷 드래그 드롭을 붙여 복사") { e.preventDefault (); }); }); 함수 isNumberKey (EVT) { VAR charCode 값 = (evt.which)? evt.which : evt.keyCode; 경우 (charCode 값> 31 && (charCode 값 <48 || charCode 값> 57)) false를 반환; true를 반환; } <링크 HREF = "https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"REL = "스타일"/> <스크립트 SRC = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">

그렇지 작동하는지 알려주세요.
16.하나 더 예를 들어 당신이 입력 필드에 숫자 만 추가 할 수있는 문자 수 없습니다

하나 더 예를 들어 당신이 입력 필드에 숫자 만 추가 할 수있는 문자 수 없습니다
```
<input type="text" class="form-control" id="phone" name="phone" placeholder="PHONE" spellcheck="false" oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');">
```
17.당신은 알파 또는 숫자는 <입력 유형 = "숫자"> 사용할 수 사이의 장치 (어쩌면 휴대 전화)에 제안합니다.

당신은 알파 또는 숫자는 <입력 유형 = "숫자"> 사용할 수 사이의 장치 (어쩌면 휴대 전화)에 제안합니다.
18.jQuery를가 대신 event.keyCode 또는 event.which보고의) (대체 사용하는 짧고 달콤한 구현 :

jQuery를가 대신 event.keyCode 또는 event.which보고의) (대체 사용하는 짧고 달콤한 구현 :
```
$('input.numeric').live('keyup', function(e) {
  $(this).val($(this).val().replace(/[^0-9]/g, ''));
});
```
유형이 지정된 문자가 잠시 나타나고 CTRL / CMD + A가 약간 이상한 행동을 보인다 만 작은 부작용.

19.입력 TYPE = "숫자"는 HTML5 속성이다.

입력 TYPE = "숫자"는 HTML5 속성이다.

다른 경우에는이 당신을 도울 것입니다 :

function isNumberKey(evt){
    var charCode = (evt.which) ? evt.which : evt.keyCode
    if (charCode > 31 && (charCode < 48 || charCode > 57))
        return false;
    return true;
}

<input type="number" name="somecode" onkeypress="return isNumberKey(event)"/>

20.자바 스크립트 코드 :

자바 스크립트 코드 :

function validate(evt)
{
    if(evt.keyCode!=8)
    {
        var theEvent = evt || window.event;
        var key = theEvent.keyCode || theEvent.which;
        key = String.fromCharCode(key);
        var regex = /[0-9]|\./;
        if (!regex.test(key))
        {
            theEvent.returnValue = false;

            if (theEvent.preventDefault)
                theEvent.preventDefault();
            }
        }
    }

HTML 코드 :

<input type='text' name='price' value='0' onkeypress='validate(event)'/>

백 스페이스 키 코드가 8하고 버그 우회 할 수있는 쉬운 방법이 그래서 정규식 표현, 그것을하지 않기 때문에 완벽하게 작동합니다 :)

21.단지 사용 유형 = 이제이 속성은 대부분의 브라우저에서 지원하는 "수"

단지 사용 유형 = 이제이 속성은 대부분의 브라우저에서 지원하는 "수"
```
<input type="number" maxlength="3" ng-bind="first">
```
22.이 문제를 해결하기위한 쉬운 방법은 예를 들어 텍스트 상자에 입력 한 정규식 부르는 것들은과 유효성에 jQuery를 기능을 구현하는 것입니다 :

이 문제를 해결하기위한 쉬운 방법은 예를 들어 텍스트 상자에 입력 한 정규식 부르는 것들은과 유효성에 jQuery를 기능을 구현하는 것입니다 :

HTML 코드 :
```
<input class="integerInput" type="text">
```
그리고 JS는 jQuery를 사용하여 기능
```
$(function() {
    $('.integerInput').on('input', function() {
      this.value = this.value
        .replace(/[^\d]/g, '');// numbers and decimals only

    });
});
```
() {(기능 $ $ ( '. integerInput'). ( '입력'기능에 () { this.value = this.value .replace (/ [^ \ D] / g ''); // 숫자와 단지 소수 }); }); <스크립트 SRC = "https://code.jquery.com/jquery-2.2.4.min.js" 무결성 = "SHA256 - BbhdlvQf / xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44 =" crossorigin = "익명">

23.jQuery를 사용에 그냥 다른 변종

jQuery를 사용에 그냥 다른 변종

$(".numeric").keypress(function() {
    return (/\d/.test(String.fromCharCode(event.which) ))
});

24.당신은 또한 같은 숫자로 강제 자체에 (기본적으로 문자열로 처리됩니다) 입력 값을 비교할 수 있습니다

당신은 또한 같은 숫자로 강제 자체에 (기본적으로 문자열로 처리됩니다) 입력 값을 비교할 수 있습니다
```
if(event.target.value == event.target.value * 1) {
    // returns true if input value is numeric string
}
```
그러나, 당신은의 keyup 등과 같은 이벤트에 바인드해야

25.

<input name="amount" type="text" value="Only number in here"/> 

<script>
    $('input[name=amount]').keyup(function(){
        $(this).val($(this).val().replace(/[^\d]/,''));
    });
</script>

26.나는 작게 그러나 나는 그들처럼 훌륭한 답변을보고 가능한 한 간단하게, 그래서 아마 누군가는 도움이됩니다. 이 같은 자바 스크립트 번호 () 및 때는 isNaN 기능을 사용합니다 :

나는 작게 그러나 나는 그들처럼 훌륭한 답변을보고 가능한 한 간단하게, 그래서 아마 누군가는 도움이됩니다. 이 같은 자바 스크립트 번호 () 및 때는 isNaN 기능을 사용합니다 :
```
if(isNaN(Number(str))) {
   // ... Exception it is NOT a number
} else {
   // ... Do something you have a number
}
```
도움이 되었기를 바랍니다.
27.이 DOM을 사용합니다 :

이 DOM을 사용합니다 :
```
<input type = "text" onkeydown = "validate(event)"/>
```
그리고이 스크립트 :
```
validate = function(evt)
{
    if ([8, 46, 37, 39, 48, 49, 50, 51, 52, 53, 54, 55, 56, 57, 35, 36].indexOf(evt.keyCode || evt.which) == -1)
    {
        evt.returnValue = false;
        if(evt.preventDefault){evt.preventDefault();}
    }
}
```
... OR의 두 가지 사용하여 같이 IndexOf없이이 스크립트, ...
```
validate = function(evt)
{
    var CharValidate = new Array("08", "046", "039", "948", "235");
    var number_pressed = false;
    for (i = 0; i < 5; i++)
    {
        for (Ncount = 0; Ncount < parseInt(CharValidate[i].substring(0, 1)) + 1; Ncount++)
        {
            if ((evt.keyCode || evt.which) == parseInt(CharValidate[i].substring(1, CharValidate[i].lenght)) + Ncount)
            {
                number_pressed = true;
            }
        }
    }
    if (number_pressed == false)
    {
        evt.returnValue = false;
        if(evt.preventDefault){evt.preventDefault();}
    }
}
```
onKeyDown에 속성이 때 onKeyPress 속성 전에 체크 때문에, 대신 때 onKeyPress의 onKeyDown에 속성을 사용했다. 문제는 구글 크롬 브라우저에있을 것입니다.

속성 "때 onKeyPress"로, TAB는 구글 크롬의 "로 preventDefault"을 제어 할 수없는 것, 그러나 "onKeyDown에"속성과 함께, TAB이 제어된다!

TAB에 대한 ASCII 코드 => 9

첫 번째 스크립트는하지만, ASCII 문자의 배열이 모든 키가 있어야합니다, 두 번째보다 적은 코드가 있습니다.

두 번째 스크립트는 처음보다 훨씬 더 큰이지만, 배열은 모든 키를 필요로하지 않습니다. 어레이의 각 위치에서의 첫 번째 숫자는 각 위치 판독 횟수이다. 각 읽기의 경우, 다음 단계로 1 증가합니다. 예를 들면 : NCount = 0

48 + 48 = NCount

NCount + +

48 + 49 = NCount

NCount + +

...

48 + 57 = NCount 숫자 키의 경우 10 (0-9),하지만 그들은 100 만한다면 그것은 모든 키 배열을 만들 의미가 없습니다.

ASCII 코드 :

28.이 개선 된 기능입니다 :

이 개선 된 기능입니다 :

function validateNumber(evt) {
  var theEvent = evt || window.event;
  var key = theEvent.keyCode || theEvent.which;
  if ((key < 48 || key > 57) && !(key == 8 || key == 9 || key == 13 || key == 37 || key == 39 || key == 46) ){
    theEvent.returnValue = false;
    if (theEvent.preventDefault) theEvent.preventDefault();
  }
}

29.가장 좋은 방법 (번호 모든 종류의 수 - 실제 음, 실제 양의 정수 음의 정수 양)입니다 :

가장 좋은 방법 (번호 모든 종류의 수 - 실제 음, 실제 양의 정수 음의 정수 양)입니다 :

$(input).keypress(function (evt){
    var theEvent = evt || window.event;
    var key = theEvent.keyCode || theEvent.which;
    key = String.fromCharCode( key );
    var regex = /[-\d\.]/; // dowolna liczba (+- ,.) :)
    var objRegex = /^-?\d*[\.]?\d*$/;
    var val = $(evt.target).val();
    if(!regex.test(key) || !objRegex.test(val+key) || 
            !theEvent.keyCode == 46 || !theEvent.keyCode == 8) {
        theEvent.returnValue = false;
        if(theEvent.preventDefault) theEvent.preventDefault();
    };
});

30.이 geowa4의 솔루션의 확장 버전입니다. 지원의 최소 및 최대 속성. 숫자 범위를 벗어나면, 이전 값을 도시한다.

이 geowa4의 솔루션의 확장 버전입니다. 지원의 최소 및 최대 속성. 숫자 범위를 벗어나면, 이전 값을 도시한다.

당신은 여기를 테스트 할 수 있습니다.

구문 :

function number(e) {
var theEvent = e || window.event;
var key = theEvent.keyCode || theEvent.which;
if(key!=13&&key!=9){//allow enter and tab
  key = String.fromCharCode( key );
  var regex = /[0-9]|\./;
  if( !regex.test(key)) {
    theEvent.returnValue = false;
    if(theEvent.preventDefault) theEvent.preventDefault();
    }   
  }
}

$(document).ready(function(){
    $("input[type=text]").filter(".number,.NUMBER").on({
        "focus":function(e){
         $(e.target).data('oldValue',$(e.target).val());
            },
        "keypress":function(e){
                e.target.oldvalue = e.target.value;
                number(e);
            },
        "change":function(e){
            var t = e.target;
            var min = $(t).attr("min");
            var max = $(t).attr("max");
            var val = parseInt($(t).val(),10);          
            if( val<min || max<val)
                {
                    alert("Error!");
                    $(t).val($(t).data('oldValue'));
                }

            }       
    });     
});

입력 동적 사용이있는 경우 :

$(document).ready(function(){
    $("body").on("focus","input[type=text].number,.NUMBER",function(e){
        $(e.target).data('oldValue',$(e.target).val());
    }); 
    $("body").on("keypress","input[type=text].number,.NUMBER",function(e){
        e.target.oldvalue = e.target.value;
        number(e);
    }); 
    $("body").on("change","input[type=text].number,.NUMBER",function(e){
        var t = e.target
        var min = $(t).attr("min");
        var max = $(t).attr("max");
        var val = parseInt($(t).val());         
        if( val<min || max<val)
            {
                alert("Error!");
                $(t).val($(t).data('oldValue'));
            }
    }); 
});

from https://stackoverflow.com/questions/469357/html-text-input-allow-only-numeric-input by cc-by-sa and MIT license

'JQUERY' 카테고리의 다른 글

[JQUERY] 어떻게 일시적으로 스크롤 해제하는 방법? (0)	2020.09.22
[JQUERY] Attr의 대 jQuery를 데이터? (0)	2020.09.22
[JQUERY] 직접 대 위임 -의 jQuery CSTE 연구진은 () (0)	2020.09.22
[JQUERY] 모든 jQuery를 Ajax 요청이 완료 될 때까지 기다립니다? (0)	2020.09.22
[JQUERY] 이벤트 핸들러가 동적 콘텐츠에 작동하지 않습니다 [중복] (0)	2020.09.22

복붙노트

[JQUERY] HTML은 텍스트 입력은 숫자 만 입력 가능

HTML은 텍스트 입력은 숫자 만 입력 가능

해결법

1.참고 :이 업데이트 된 대답이다. 댓글은 아래의 키 코드 주위에 엉망이 이전 버전을 참조하십시오.

2.이 DOM을 사용

3.나는이에 좋은 답변을 위해 오랫동안 열심히 검색 한, 우리는 필사적으로 <입력 유형 = "숫자"를 필요로하지만, 짧은 그,이 둘은 내가 가지고 올 수있는 가장 간결한의 방법은 다음과 같습니다

4.여기에 더 이상 정확히 하나의 진수를 허용하지만, 간단한 하나입니다 :

5.나를 위해 좋은 작품 그리고 또 하나의 예 :

6.대부분의 대답은 여기에 모든 키 - 이벤트를 사용하는 약점을 가지고있다.

7.HTML5는 <입력 유형 = 수>, 당신을 위해 잘 들린다 있습니다. 현재, 오페라는 기본적으로 지원하지만, 자바 스크립트 구현이 프로젝트가있다.

8.당신이 사용할 수 있도록 HTML5는 정규 표현식에를 지원합니다 :

9.나는 여기에 언급 된 두 답변의 조합을 사용하기로 선택 즉,

10.자바 스크립트

11.그래서 간단 ....

12.이 개 솔루션 :

13.더 안전한 방식 대신 키 누름을 하이재킹 필터 키 코드하려고 노력 입력의 값을 확인한다.

14.당신은 이것에 대한 패턴을 사용할 수 있습니다 :

15.상술 한 솔루션을 검색 할 수 있습니다. 이 사용자는 숫자 값을 입력 할 수 있습니다에서, 또한 사용자가 복사, 붙여 넣기, 드래그를 입력 드롭 할 수 없습니다.

16.하나 더 예를 들어 당신이 입력 필드에 숫자 만 추가 할 수있는 문자 수 없습니다

17.당신은 알파 또는 숫자는 <입력 유형 = "숫자"> 사용할 수 사이의 장치 (어쩌면 휴대 전화)에 제안합니다.

18.jQuery를가 대신 event.keyCode 또는 event.which보고의) (대체 사용하는 짧고 달콤한 구현 :

19.입력 TYPE = "숫자"는 HTML5 속성이다.

20.자바 스크립트 코드 :

21.단지 사용 유형 = 이제이 속성은 대부분의 브라우저에서 지원하는 "수"

22.이 문제를 해결하기위한 쉬운 방법은 예를 들어 텍스트 상자에 입력 한 정규식 부르는 것들은과 유효성에 jQuery를 기능을 구현하는 것입니다 :

23.jQuery를 사용에 그냥 다른 변종

24.당신은 또한 같은 숫자로 강제 자체에 (기본적으로 문자열로 처리됩니다) 입력 값을 비교할 수 있습니다

25.

26.나는 작게 그러나 나는 그들처럼 훌륭한 답변을보고 가능한 한 간단하게, 그래서 아마 누군가는 도움이됩니다. 이 같은 자바 스크립트 번호 () 및 때는 isNaN 기능을 사용합니다 :

27.이 DOM을 사용합니다 :

28.이 개선 된 기능입니다 :

29.가장 좋은 방법 (번호 모든 종류의 수 - 실제 음, 실제 양의 정수 음의 정수 양)입니다 :

30.이 geowa4의 솔루션의 확장 버전입니다. 지원의 최소 및 최대 속성. 숫자 범위를 벗어나면, 이전 값을 도시한다.

'JQUERY' 카테고리의 다른 글

티스토리툴바