자바 스크립트를 사용하여 숫자 만 제한하고 범위를 최대 및 최소로 설정하기위한 입력 필드의 유효성을 검사하는 방법
Roumil 그만해
On event change the overflow value must get rejected.
사용자가 0에서 99999 사이의 숫자 만 입력하도록 제한하려는 양식에 입력 상자가 있습니다. 하지만 탭 버튼 기능을 비활성화하고 싶지 않습니다. 아래 코드는 "NUMBERS only"에서 잘 작동하지만 Tab 버튼도 사용할 수 없습니다. 또한 누군가가 99999보다 큰 숫자를 입력하면 오버플로 상태를 확인하지 않습니다.
<script>
function myIdFunction() {
var txt = "";
if (document.getElementById("EmpId").validity.rangeOverflow) {
txt = "Value too large";
}
document.getElementById("demo").innerHTML = txt;
}
</script>
<input type="text" name="id" id="EmpId" ng-model="EmpId" max="99999"
onchange="myIdFunction()" onkeypress="return IsNumeric(event);"
ondrop="return false;" onpaste="return false;" ng-disabled="!edit"
placeholder="EmpId" required>
<span id="error" style="color: Red; display: none">* Input digits (0 -)</span>
<script type="text/javascript">
var specialKeys = new Array();
specialKeys.push(8); //Backspace
function IsNumeric(e) {
var keyCode = e.which ? e.which : e.keyCode
var ret = ((keyCode >= 48 && keyCode <= 57) ||
specialKeys.indexOf(keyCode) != -1);
document.getElementById("error").style.display = ret ? "none" : "inline";
return ret;
}
</script>
rsp
<input type=number min=0 max=99999>
제공 :
사양은 다음을 참조하십시오.
지원되는 브라우저는 다음을 참조하십시오.
이전 브라우저의 경우 다음을 사용하십시오.
( <input type=number>현재이를 지원하지 않는 브라우저 에서 HTML5 요소 를 구현하기위한 폴리 필입니다 .)
정확한 값의 실시간 시행
사용자가 입력하는 동안 잘못된 값을 입력하지 못하도록하려는 경우 :
var last = '';
input.addEventListener('input', function () {
if (this.checkValidity()) {
last = this.value;
} else {
this.value = last;
}
});
참조 : DEMO .
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
에서 수정
몇 마디 만하겠습니다