2012-03-28 3 views
0

자바 스크립트를 사용하여 텍스트 상자에 6 자리 숫자와 2 개의 십진수 값만 입력하도록 사용자를 제한하는 방법 ??자바 스크립트를 사용하여 텍스트 상자에 10 진수 값의 유효성 검사

//Function to allow only numbers to textbox 
function validate(key) { 
    //getting key code of pressed key 
    var keycode = (key.which) ? key.which : key.keyCode; 
    var phn = document.getElementById('txtPhn'); 
    //comparing pressed keycodes 
    if ((keycode < 48 || keycode > 57)) { 
     return false; 
    } else { 
     if (phn.value.length < 6) { 
      return true; 
     } else { 
      return false; 
     } 
    } 
} 

편집 :

var txtBudget = document.getElementById('MainContent_txtBudget'); 
    txtBudget.addEventListener('input', function (prev) 
    { 
     return function (evt) { 
      if (!/^\d{0,6}(?:\.\d{0,2})?$/.test(this.value)) { 
       this.value = prev; 
      } 
      else { 
       prev = this.value; 
      } 
     }; 
    } (txtBudget.value), false); 
+0

주 당신은 키 코드 (96)를 포함 할. 또한 백 스페이스, 탭 및 화살표 키도 커버해야합니다. –

답변

3

당신은 이런 식으로 뭔가를 시도 할 수 있습니다 :

var foo = document.getElementById('foo'); 

foo.addEventListener('input', function (prev) { 
    return function (evt) { 
     if (!/^\d{0,6}(?:\.\d{0,2})?$/.test(this.value)) { 
      this.value = prev; 
     } 
     else { 
      prev = this.value; 
     } 
    }; 
}(foo.value), false);​ 

코드는 크로스 브라우저 호환되지 않는,하지만 당신은 어떻게 할 수의 힌트를 제공해야 끝내라.

데모 : http://jsfiddle.net/v4tGc/


업데이트 다음 입력 이벤트를 사용하지. 뿐만 아니라 숫자 키패드입니다 (105), -

var foo = document.getElementById('foo'); 

foo.addEventListener('keypress', function (evt) { 
    var value = this.value + String.fromCharCode(evt.which); 
    if (!/^\d{0,6}(?:\.\d{0,2})?$/.test(value)) { 
     evt.preventDefault(); 
    } 
}, false);​ 
+1

텍스트 상자의 onkeypress 이벤트에서이 함수를 호출하는 방법 ?? – kk1076

+0

내 편집을보세요. – kk1076

+0

나는 이처럼 시도했지만 작동하지 않습니다 – kk1076

0
**When I Googling, found a code. And then i modify to what i need. And I think it will help you**. 

    **HTML** 

     <html> 
      <head> 
       <meta charset="utf-8"> 
       <title>JS Bin</title> 
      </head> 
      <body> 
       <input type="text" id="sal" name="sal" onkeypress="return isDecimalNumber(event,this)"> 
      </body> 
     </html> 

    **Javascript** 



<script type="text/javascript"> 

      function isDecimalNumber(evt, c) { 
       var charCode = (evt.which) ? evt.which : event.keyCode; 
       var dot1 = c.value.indexOf('.'); 
       var dot2 = c.value.lastIndexOf('.'); 

       if (charCode != 46 && charCode > 31 && (charCode < 48 || charCode > 57)) 
        return false; 
       else if (charCode == 46 && (dot1 == dot2) && dot1 != -1 && dot2 != -1) 
        return false; 

       return true; 
      } 

     </script> 
관련 문제