source

jQuery: 텍스트 상자에 "숫자"만 입력하는 것을 제한하는 가장 좋은 방법은 무엇입니까?(소수점 허용)

manycodes 2023. 8. 19. 10:29
반응형

jQuery: 텍스트 상자에 "숫자"만 입력하는 것을 제한하는 가장 좋은 방법은 무엇입니까?(소수점 허용)

텍스트 상자에 "숫자"만 입력하는 것을 제한하는 가장 좋은 방법은 무엇입니까?

저는 소수점이 가능한 것을 찾고 있습니다.

저는 많은 예를 봅니다.하지만 어떤 것을 사용할지 아직 결정하지 못했습니다.

Praveen Jeganathan에서 업데이트.

이상 플러그인이 . 플러그인을 했습니다. jQuery는 플러그인이 없습니다.jQuery.isNumeric()v1.7에 추가되었습니다.참조: https://stackoverflow.com/a/20186188/66767

유효성 검사가 아닌 입력을 제한하려면 다음과 같은 주요 이벤트를 사용할 수 있습니다.

<input type="text" class="numbersOnly" value="" />

그리고:

jQuery('.numbersOnly').keyup(function () { 
    this.value = this.value.replace(/[^0-9\.]/g,'');
});

이를 통해 사용자는 나중에 유효성 검사 단계에서 알파벳 문자 등을 입력할 수 없음을 즉시 알 수 있습니다.

입력이 마우스로 잘라낸 후 붙여넣거나 주요 이벤트를 트리거하지 않을 수 있는 양식 자동 완성기로 채워질 수 있으므로 유효성을 검사해야 합니다.

갱신하다

이를 위한 새롭고 매우 간단한 솔루션이 있습니다.

텍스트에 모든 종류의 입력 필터를 사용할 수 있습니다.<input>다양한 숫자 필터를 포함합니다.이렇게 하면 복사+붙여넣기, 끌어서 놓기, 키보드 단축키, 상황에 맞는 메뉴 작업, 입력할 수 없는 키 및 모든 키보드 레이아웃이 올바르게 처리됩니다.

답변을 보거나 JSFidle에서 직접 사용해 보십시오.

jquery.dll 플러그인

저는 jquery.numeric 플러그인으로 많은 양식을 성공적으로 구현했습니다.

$(document).ready(function(){
    $(".numeric").numeric();
});

게다가 이것은 텍스트 영역에서도 작동합니다!

그러나 Ctrl+A, Copy+Paste(상황에 맞는 메뉴를 통해) 및 Drag+Drop은 예상대로 작동하지 않습니다.

HTML 5

으로 HTML 5를 사용할 수 .pattern 및 속성number을 입력합니다.input숫자 입력만 제한하는 요소입니다.구글 크롬 (Google Chrome)에서는 숫자가 아닌 내용을 붙여넣는 것도 제한합니다.에 대한 자세한 내용은 다음과 .number기타 새로운 입력 유형을 사용할 수 있습니다.

저는 위의 답이 그냥 이렇게 하는 것이 가장 좋은 답이라고 생각했습니다.

jQuery('.numbersOnly').keyup(function () {  
    this.value = this.value.replace(/[^0-9\.]/g,''); 
});

하지만 화살표 키와 삭제 버튼이 문자열 끝에 커서를 맞추는 것이 조금 고통스럽다는 것에 동의합니다(그리고 그것 때문에 그것은 테스트에서 나에게 다시 걷어찼습니다).

간단한 변경으로 추가했습니다.

$('.numbersOnly').keyup(function () {
    if (this.value != this.value.replace(/[^0-9\.]/g, '')) {
       this.value = this.value.replace(/[^0-9\.]/g, '');
    }
});

이렇게 하면 텍스트가 변경되지 않는 버튼이 있을 경우 무시합니다.이렇게 하면 끝까지 점프하지 않고 화살표를 누르고 삭제할 수 있지만 숫자가 아닌 텍스트는 삭제됩니다.

jquery.numeric 플러그인에 작성자에게 알렸던 버그가 있습니다.Safari 및 Opera에서는 소수점을 여러 개 사용할 수 있으며 Opera에서는 백스페이스, 화살표 키 또는 기타 여러 개의 제어 문자를 입력할 수 없습니다.저는 양의 정수 입력이 필요해서 결국 저만의 입력을 하게 되었습니다.

$(".numeric").keypress(function(event) {
  // Backspace, tab, enter, end, home, left, right
  // We don't support the del key in Opera because del == . == 46.
  var controlKeys = [8, 9, 13, 35, 36, 37, 39];
  // IE doesn't support indexOf
  var isControlKey = controlKeys.join(",").match(new RegExp(event.which));
  // Some browsers just don't raise events for control keys. Easy.
  // e.g. Safari backspace.
  if (!event.which || // Control keys in most browsers. e.g. Firefox tab is 0
      (49 <= event.which && event.which <= 57) || // Always 1 through 9
      (48 == event.which && $(this).attr("value")) || // No 0 first digit
      isControlKey) { // Opera assigns values for control keys.
    return;
  } else {
    event.preventDefault();
  }
});

더 이상 플러그인이 없습니다. jQuery는 v1.7에 추가된 자체 jQuery.isNumeric()을 구현했습니다.

jQuery.isNumeric( value )

인수가 숫자인지 여부를 결정합니다.

샘플 결과

$.isNumeric( "-10" );     // true
$.isNumeric( 16 );        // true
$.isNumeric( 0xFF );      // true
$.isNumeric( "0xFF" );    // true
$.isNumeric( "8e5" );     // true (exponential notation string)
$.isNumeric( 3.1415 );    // true
$.isNumeric( +10 );       // true
$.isNumeric( 0144 );      // true (octal integer literal)
$.isNumeric( "" );        // false
$.isNumeric({});          // false (empty object)
$.isNumeric( NaN );       // false
$.isNumeric( null );      // false
$.isNumeric( true );      // false
$.isNumeric( Infinity );  // false
$.isNumeric( undefined ); // false

다음은 isNumeric()을 이벤트 수신기와 연결하는 방법의 예입니다.

$(document).on('keyup', '.numeric-only', function(event) {
   var v = this.value;
   if($.isNumeric(v) === false) {
        //chop off the last char entered
        this.value = this.value.slice(0,-1);
   }
});

위에서 언급한 숫자() 플러그인은 오페라에서 작동하지 않습니다(백스페이스, 삭제 또는 뒤로 가기 또는 앞으로 가기 키를 사용할 수 없습니다).

아래 코드는 JQuery 또는 Javascript 모두에서 완벽하게 작동합니다(단 두 줄).

JQuery:

$(document).ready(function() {
    $('.key-numeric').keypress(function(e) {
            var verified = (e.which == 8 || e.which == undefined || e.which == 0) ? null : String.fromCharCode(e.which).match(/[^0-9]/);
            if (verified) {e.preventDefault();}
    });
});

Javascript:

function isNumeric(e)
{
    var keynum = (!window.event) ? e.which : e.keyCode;
    return !((keynum == 8 || keynum == undefined || e.which == 0) ? null : String.fromCharCode(keynum).match(/[^0-9]/));
}

물론 이것은 순수 숫자 입력(백스페이스, 삭제, 앞으로/뒤로 키 포함)에만 해당되지만 점과 빼기 문자를 포함하도록 쉽게 변경할 수 있습니다.

유효성 검사 플러그인을 해당 number() 메서드와 함께 사용할 수 있습니다.

$("#myform").validate({
  rules: {
    field: {
      required: true,
      number: true
    }
  }
});

번호 입력 제한을 위해 긴 코드가 필요하지 않습니다. 이 코드를 사용해 보십시오.

또한 유효한 int 및 float 두 값을 모두 사용할 수 있습니다.

자바스크립트 접근법

onload =function(){ 
  var ele = document.querySelectorAll('.number-only')[0];
  ele.onkeypress = function(e) {
     if(isNaN(this.value+""+String.fromCharCode(e.charCode)))
        return false;
  }
  ele.onpaste = function(e){
     e.preventDefault();
  }
}
<p> Input box that accepts only valid int and float values.</p>
<input class="number-only" type=text />

jQuery 접근법

$(function(){

  $('.number-only').keypress(function(e) {
	if(isNaN(this.value+""+String.fromCharCode(e.charCode))) return false;
  })
  .on("cut copy paste",function(e){
	e.preventDefault();
  });

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p> Input box that accepts only valid int and float values.</p>
<input class="number-only" type=text />

갱신하다

위의 답변은 가장 일반적인 사용 사례인 입력을 숫자로 검증하는 것입니다.

그러나 아래는 특수 사용 사례를 위한 코드 조각입니다.

  • 음수 허용
  • 키 입력을 제거하기 전에 잘못된 키 입력을 표시합니다.

$(function(){
      
  $('.number-only').keyup(function(e) {
        if(this.value!='-')
          while(isNaN(this.value))
            this.value = this.value.split('').reverse().join('').replace(/[\D]/i,'')
                                   .split('').reverse().join('');
    })
    .on("cut copy paste",function(e){
    	e.preventDefault();
    });

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p> Input box that accepts only valid int and float values.</p>
<input class="number-only" type=text />

아래는 제가 문자 그대로 키 입력을 차단하기 위해 사용하는 것입니다.숫자 0-9와 소수점만 허용됩니다.구현하기 쉽고 코드가 많지 않으며 매력적으로 작동합니다.

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

<input value="" onkeypress="return isNumberKey(event)">

제안을 약간 개선하기 위해 유효성 검사 플러그인을 해당 번호(), 숫자범위 메서드와 함께 사용할 수 있습니다.예를 들어, 다음은 0과 50 사이의 양의 정수를 얻을 수 있도록 보장합니다.

$("#myform").validate({
  rules: {
    field: {
      required: true,
      number: true,
      digits: true,
      range : [0, 50]
    }
  }
});

당신은 키를 누르면 알파벳 마법의 모습과 사라지는 것을 볼 수 없습니다.이것은 마우스 페이스트에서도 작동합니다.

$('#txtInt').bind('input propertychange', function () {
    $(this).val($(this).val().replace(/[^0-9]/g, ''));
});

저는 처음에 jQuery를 사용하여 이 문제를 해결하려고 시도했지만, 키업에서 제거되기 직전에 실제로 입력 필드에 나타나는 원하지 않는 문자(숫자가 아닌 문자)가 마음에 들지 않았습니다.

다른 솔루션을 찾아보니 다음과 같습니다.

정수(음이 아닌)

<script>
  function numbersOnly(oToCheckField, oKeyEvent) {
    return oKeyEvent.charCode === 0 ||
        /\d/.test(String.fromCharCode(oKeyEvent.charCode));
  }
</script>

<form name="myForm">
<p>Enter numbers only: <input type="text" name="myInput" 
    onkeypress="return numbersOnly(this, event);" 
    onpaste="return false;" /></p>
</form>

출처: https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers.onkeypress#Example 실시간 예: http://jsfiddle.net/u8sZq/

소수점(음이 아님)

소수점 하나를 허용하려면 다음과 같은 작업을 수행할 수 있습니다.

<script>
  function numbersOnly(oToCheckField, oKeyEvent) {        
    var s = String.fromCharCode(oKeyEvent.charCode);
    var containsDecimalPoint = /\./.test(oToCheckField.value);
    return oKeyEvent.charCode === 0 || /\d/.test(s) || 
        /\./.test(s) && !containsDecimalPoint;
  }
</script>

출처: 방금 이것을 썼습니다.효과가 있는 것 같습니다.실시간 예: http://jsfiddle.net/tjBsF/

기타 사용자 정의

  • 더 많은 기호를 입력할 수 있도록 하려면 기본 문자 코드 필터 역할을 하는 정규식에 기호를 추가하기만 하면 됩니다.
  • 간단한 상황별 제한을 구현하려면 입력 필드의 현재 내용(상태)(oToCheckField.value)을 확인합니다.

다음과 같은 작업을 수행할 수 있습니다.

  • 소수점 하나만 허용됩니다.
  • 문자열의 시작 부분에 있는 경우에만 빼기 기호를 허용합니다.이렇게 하면 음수를 사용할 수 있습니다.

단점

  • 캐럿 위치는 함수 내에서 사용할 수 없습니다.따라서 구현할 수 있는 상황별 제한이 크게 감소했습니다(예: 두 개의 동일한 연속 기호 없음).액세스하는 가장 좋은 방법이 무엇인지 잘 모르겠습니다.

제목이 jQuery 솔루션을 요구한다는 것을 알지만, 누군가가 어쨌든 이것을 유용하게 여길 수 있기를 바랍니다.

Dave Aaron Smith 게시물 감사합니다.

숫자 섹션에서 소수점과 숫자를 사용할 수 있도록 답변을 수정했습니다.이 일은 나에게 딱 맞습니다.

$(".numeric").keypress(function(event) {
  // Backspace, tab, enter, end, home, left, right,decimal(.)in number part, decimal(.) in alphabet
  // We don't support the del key in Opera because del == . == 46.
  var controlKeys = [8, 9, 13, 35, 36, 37, 39,110,190];
  // IE doesn't support indexOf
  var isControlKey = controlKeys.join(",").match(new RegExp(event.which));
  // Some browsers just don't raise events for control keys. Easy.
  // e.g. Safari backspace.
  if (!event.which || // Control keys in most browsers. e.g. Firefox tab is 0
      (49 <= event.which && event.which <= 57) || // Always 1 through 9
      (96 <= event.which && event.which <= 106) || // Always 1 through 9 from number section 
      (48 == event.which && $(this).attr("value")) || // No 0 first digit
      (96 == event.which && $(this).attr("value")) || // No 0 first digit from number section
      isControlKey) { // Opera assigns values for control keys.
    return;
  } else {
    event.preventDefault();
  }
});
   window.jQuery.fn.ForceNumericOnly =
       function () {

           return this.each(function () {
               $(this).keydown(function (event) {
                   // Allow: backspace, delete, tab, escape, and enter
                   if (event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 27 || event.keyCode == 13 ||
                       // Allow: Ctrl+A
                       (event.keyCode == 65 && event.ctrlKey === true) ||
                       // Allow: home, end, left, right
                       (event.keyCode >= 35 && event.keyCode <= 39)) {
                       // let it happen, don't do anything
                       return;
                   } else {
                       // Ensure that it is a number and stop the keypress
                       if (event.shiftKey || (event.keyCode < 48 || event.keyCode > 57) && (event.keyCode < 96 || event.keyCode > 105)) {
                           event.preventDefault();
                       }
                   }
               });
           });
       };

원하는 모든 입력에 이 옵션을 적용합니다.

$('selector').ForceNumericOnly();

이 기능은 위의 아이디어 중 일부를 사용하여 동일한 작업을 수행합니다.

$field.keyup(function(){
    var val = $j(this).val();
    if(isNaN(val)){
         val = val.replace(/[^0-9\.]/g,'');
         if(val.split('.').length>2) val =val.replace(/\.+$/,"");
    }
    $j(this).val(val); 
});
  • 시각적 피드백 표시(사라지기 전에 나타나는 문자)
  • 소수점 이하 허용
  • 여러 개의 "."를 캐치합니다.
  • 왼쪽/오른쪽 del 등에 문제가 없습니다.

Can에 따르면 HTML5는 글로벌 브라우저 88% 이상을 지원하는 입력 유형 번호를 지원합니다.2015년 10월 기준.

<input type="number" step="0.01" min="0" name="askedPrice" id="askedPrice" />

JQuery와 관련된 솔루션은 아니지만, 휴대폰에서는 안드로이드 키보드가 숫자 입력에 최적화된다는 것이 장점입니다.

또는 새 매개 변수 "패턴"이 있는 입력 유형 텍스트를 사용할 수 있습니다.HTML5 사양에 자세한 내용이 나와 있습니다.

이 질문에서 제공된 jquery 솔루션은 수천 개의 분리기를 지원하지 않기 때문에 jquery 솔루션보다 더 낫다고 생각합니다.만약 당신이 html5를 사용할 수 있다면요.

JSFidle: https://jsfiddle.net/p1ue8qxj/

이것은 제 크로스 브라우저 버전의 HTML 입력 상자에서 jQuery를 사용하여 숫자(0-9)만 허용하는 방법입니까?
*/

$("#inputPrice").keydown(function(e){
    var keyPressed;
    if (!e) var e = window.event;
    if (e.keyCode) keyPressed = e.keyCode;
    else if (e.which) keyPressed = e.which;
    var hasDecimalPoint = (($(this).val().split('.').length-1)>0);
    if ( keyPressed == 46 || keyPressed == 8 ||((keyPressed == 190||keyPressed == 110)&&(!hasDecimalPoint && !e.shiftKey)) || keyPressed == 9 || keyPressed == 27 || keyPressed == 13 ||
             // Allow: Ctrl+A
            (keyPressed == 65 && e.ctrlKey === true) ||
             // Allow: home, end, left, right
            (keyPressed >= 35 && keyPressed <= 39)) {
                 // let it happen, don't do anything
                 return;
        }
        else {
            // Ensure that it is a number and stop the keypress
            if (e.shiftKey || (keyPressed < 48 || keyPressed > 57) && (keyPressed < 96 || keyPressed > 105 )) {
                e.preventDefault();
            }
        }

  });

parseFloat()을 통해 .은 것입다니돌올아▁return다를 반환할 것입니다.NaN잘못된 입력으로

decorplanit.com 에서 autoNumeric을 사용할 수 있습니다.그들은 숫자뿐만 아니라 통화, 반올림 등에 대한 훌륭한 지원을 가지고 있습니다.

저는 CSS 수정이 거의 없는 IE6 환경에서 사용했고, 그것은 합리적인 성공이었습니다.

를 들어, 클래스는 "", CSS ""입니다.numericInput정의할 수 있으며 숫자 입력 마스크로 필드를 장식하는 데 사용할 수 있습니다.

autoNumeric 웹 사이트에서 수정됨:

$('input.numericInput').autoNumeric({aSep: '.', aDec: ','}); // very flexible!

HTML5를 사용하는 경우 검증을 수행하기 위해 많은 노력을 기울일 필요가 없습니다.그냥 사용하세요 -

<input type="number" step="any" />

단계 속성을 사용하면 소수점이 유효할 수 있습니다.

이것이 이 문제를 해결하는 좋은 방법이며 매우 간단합니다.

$(function() {
    var pastValue, pastSelectionStart, pastSelectionEnd;

    $("input").on("keydown", function() {
        pastValue          = this.value;
        pastSelectionStart = this.selectionStart;
        pastSelectionEnd   = this.selectionEnd;
    }).on("input propertychange", function() {
        var regex = /^[0-9]+\.?[0-9]*$/;

        if (this.value.length > 0 && !regex.test(this.value)) {
            this.value          = pastValue;
            this.selectionStart = pastSelectionStart;
            this.selectionEnd   = pastSelectionEnd;
        }
    });
});

예: 제이에스아이들

대상 시나리오

여기서 가장 유사한 권장 사항은 이러한 시나리오 중 하나 이상에 실패하거나 이러한 시나리오를 모두 포함하기 위해 많은 코드가 필요합니다.

  1. 소수점 하나만 허용합니다.
  2. 를 허용합니다.home,end 리고그고.arrow열쇠들.
  3. 를 허용합니다.delete그리고.backspace모든 인덱스에서 사용됩니다.
  4. 입력이 정규식과 일치하는 경우 인덱스에서 편집할 수 있습니다.
  5. 유효한 입력에 대해 ctrl+v 및 shift+insert를 허용합니다(오른쪽 클릭+붙여넣기와 동일).
  6. 텍스트 값이 깜박이지 않습니다. 왜냐하면keyup이벤트가 사용되지 않습니다.
  7. 잘못된 입력 후 선택 영역을 복원합니다.

시나리오 실패

  • 으로 0.50만 삭제해도 작동하지 않습니다.정규식을 다음으로 변경하여 이 문제를 해결할 수 있습니다./^[0-9]*\.?[0-9]*$/그런 다음 블러 이벤트를 추가하여 데이터를 추가0텍스트 상자가 소수점으로 시작하는 경우(원하는 경우).이 문제를 해결하는 방법에 대한 자세한 내용은 이 고급 시나리오를 참조하십시오.

플러그인

나는 이것을 더 쉽게 하기 위해 이 간단한 jquery 플러그인을 만들었습니다.

$("input").limitRegex(/^[0-9]+\.?[0-9]*$/);

텍스트 상자가 초점을 잃을 때마다 텍스트 상자의 내용을 확인하는 것이 가장 좋은 방법입니다.

정규식을 사용하여 내용이 "숫자"인지 확인할 수 있습니다.

또는 기본적으로 자동으로 이 작업을 수행하는 검증 플러그인을 사용할 수 있습니다.

데이터베이스 사용에 대한 다음 찾기 코드를 확인합니다.

function numonly(root){
    >>var reet = root.value;
    var arr1 = reet.length;
    var ruut = reet.charAt(arr1-1);
    >>>if (reet.length > 0){
        var regex = /[0-9]|\./;
        if (!ruut.match(regex)){
            var reet = reet.slice(0, -1);
            $(root).val(reet);
        >>>>}
    }
}
//Then use the even handler onkeyup='numonly(this)'

텍스트 필드에서 정수 퍼센트 유효성 검사를 위해 방금 수행한 코드 일부입니다(jQuery 필요).

/* This validates that the value of the text box corresponds
 * to a percentage expressed as an integer between 1 and 100,
 * otherwise adjust the text box value for this condition is met. */
$("[id*='percent_textfield']").keyup(function(e){
    if (!isNaN(parseInt(this.value,10))) {
        this.value = parseInt(this.value);
    } else {
        this.value = 0;
    }
    this.value = this.value.replace(/[^0-9]/g, '');
    if (parseInt(this.value,10) > 100) {
        this.value = 100;
        return;
    }
});

다음 코드:

  • 기본 숫자 키와 숫자 키패드를 사용할 수 있습니다.
  • Shift-숫자 문자(예: #, $, % 등) 제외 확인
  • NaN 값을 0으로 바꿉니다.
  • 100보다 높은 100개의 값으로 대체

이것이 도움이 필요한 사람들에게 도움이 되기를 바랍니다.

여기에서 훌륭한 솔루션을 찾으십시오. http://ajax911.com/numbers-numeric-field-jquery/

요구 사항에 따라 "키업"을 "키다운"으로 변경했습니다.

입력에서 캐럿 위치를 유지하는 다른 방법:

$(document).ready(function() {
  $('.numbersOnly').on('input', function() {
    var position = this.selectionStart - 1;

    fixed = this.value.replace(/[^0-9\.]/g, '');  //remove all but number and .
    if(fixed.charAt(0) === '.')                  //can't start with .
      fixed = fixed.slice(1);

    var pos = fixed.indexOf(".") + 1;
    if(pos >= 0)
      fixed = fixed.substr(0,pos) + fixed.slice(pos).replace('.', '');  //avoid more than one .

    if (this.value !== fixed) {
      this.value = fixed;
      this.selectionStart = position;
      this.selectionEnd = position;
    }
  });
});

장점:

  1. 사용자는 백스페이스, 삭제 등의 화살표 키를 사용할 수 있습니다.
  2. 숫자를 붙여넣을 때 작동합니다.

플런커:데모 작업

더 좋은 플러그인을 찾았습니다.훨씬 더 많은 제어 권한을 제공합니다.숫자가 필요하지만 "/" 또는 "-" 문자를 사용할 수 있는 DOB 필드가 있다고 가정합니다.

잘 작동합니다!

http://itgroup.com.ph/alphanumeric/ 에서 확인해 보세요.

    $(".numeric").keypress(function(event) {
  // Backspace, tab, enter, end, home, left, right
  // We don't support the del key in Opera because del == . == 46.
  var controlKeys = [8, 9, 13, 35, 36, 37, 39];
  // IE doesn't support indexOf
  var isControlKey = controlKeys.join(",").match(new RegExp(event.which));
  // Some browsers just don't raise events for control keys. Easy.
  // e.g. Safari backspace.
  if (!event.which || // Control keys in most browsers. e.g. Firefox tab is 0
      (49 <= event.which && event.which <= 57) || // Always 1 through 9
      (48 == event.which && $(this).attr("value")) || // No 0 first digit
      isControlKey) { // Opera assigns values for control keys.
    return;
  } else {
    event.preventDefault();
  }
});

이 코드는 저에게 꽤 잘 작동했습니다. 저는 기간을 사용하기 위해 controlKeys 배열에 46을 추가해야 했습니다. 비록 그것을 하는 가장 좋은 방법은 아니라고 생각하지만;)

저는 이것을 사용했고, 좋은 결과를 얻었습니다.

ini=$("#id").val();
a=0;
$("#id").keyup(function(e){
    var charcode = (e.which) ? e.which : e.keyCode;
    // for decimal point
    if(!(charcode===190 || charcode===110))
    {           // for numeric keys andcontrol keys
        if (!((charcode>=33 && charcode<=57) || 
        // for numpad numeric keys
        (charcode>=96 && charcode<=105) 
        // for backspace
        || charcode==8)) 
        {
            alert("Sorry! Only numeric values allowed.");
            $("#id").val(ini);
        }
        // to include decimal point if first one has been deleted.
        if(charcode===8)
        {
            ini=ini.split("").reverse();
            if(ini[0]==".")
            a=0;                 
        }
    }
    else
    {
        if(a==1)
        {
            alert("Sorry! Second decimal point not allowed.");
            $("#id").val(ini);
        }
        a=1;
    }
    ini=$("#id").val();
});


find keycodes at http://www.cambiaresearch.com/articles/15/javascript-char-codes-key-codes

이것은 매우 간단합니다. 자바스크립트 내장 함수 "isNaN"이 이미 있습니다.

$("#numeric").keydown(function(e){
  if (isNaN(String.fromCharCode(e.which))){ 
    return false; 
  }
});

언급URL : https://stackoverflow.com/questions/891696/jquery-what-is-the-best-way-to-restrict-number-only-input-for-textboxes-all

반응형