![](/img/trans.png)
[英]html <input type=“text” /> number-only with min and max value
[英]How to limit the max and min value of number in html text field
我有一个文本字段,应允许用户输入数字,最大长度应为2,最大值应为31,最小值应为1我能够前2个条件,但不知道最后2个条件
有人能帮帮我吗?
<input type="text" name = "ccdate" class="form-control" maxlength="2" onkeypress="return isNumber(event)" >
function isNumber(evt) {
evt = (evt) ? evt : window.event;
var charCode = (evt.which) ? evt.which : evt.keyCode;
if (charCode > 31 && (charCode < 48 || charCode > 57)) {
return false;
}
return true;
}
NOte我不想使用HTML5输入类型=“数字”
document.querySelector("*[name=ccdate]").addEventListener("input", function () {
var num = +this.value, max = 31, min = 1; //converts value to a Number
if(!this.value.length) return false; //allows empty field
this.value = isNaN(num) ? min : num > max ? max : num < min ? min : num;
});
试试这个(Purely Jquery方法):
HTML:
<input type="text" name = "ccdate" class="form-control" maxlength="2">
<div id="div1"></div>
JQUERY:
$('[name="ccdate"]').keyup(function(){
if(parseInt($(this).val()) > 31){
$('#div1').html('value cannot be greater then 31');
$(this).val('');
}
else if(parseInt($(this).val()) < 1)
{
$('#div1').html('value cannot be lower then 1');
$(this).val('');
}
else
{ $('#div1').html(''); }
});
编辑: - (根据提问者评论检查用户输入的字符串或数字):
$('[name="ccdate"]').keyup(function(){
if(isNaN($(this).val()))
{
$('#div1').html('entered string');
$(this).val('');
}
else if(parseInt($(this).val()) > 31){
$('#div1').html('value cannot be greater then 31');
$(this).val('');
}
else if(parseInt($(this).val()) < 1)
{
$('#div1').html('value cannot be lower then 0');
$(this).val('');
}
else
{ $('#div1').html(''); }
});
编辑: - (纯Javascript方法)(只需为您的文本框提供一个唯一的id
,说't1'
)
document.getElementById('t1').addEventListener('keyup', function(){
this.value = (parseInt(this.value) < 1 || parseInt(this.value) > 31 || isNaN(this.value)) ? "" : (this.value)
});
使用min和max属性,如果您希望用户输入数字,请将输入类型设为数字,而不是将其作为文本提供...
<input type="number" name ="name_u_want_to_give" min="1" max="31" maxlength="2" />
请根据您的要求更正以下代码。
`<script type="text/javascript">
function minmax(value, min, max)
{
if(parseInt(value) < 0 || isNaN(value))
return 0;
else if(parseInt(value) > 100)
return 100;
else return value;
}
</script>
<input type="text" name="textWeight" id="txtWeight" maxlength="5" onkeyup="this.value =minmax(this.value, 0, 100)"/>`
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.