移动端输入框如果类型是number，用户也可以输入汉字和字母

最新推荐文章于 2021-06-17 16:28:09 发布

weixin_30617797

最新推荐文章于 2021-06-17 16:28:09 发布

阅读量217

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/lst619247/p/8559453.html

本文介绍了一个使用JavaScript实现的年龄输入框功能，该功能能够确保用户输入的年龄为数字且不超过两位数。通过正则表达式匹配和事件监听，有效地限制了输入的内容。

<input type="number" id="input-age" placeholder="请输入你的年龄"  />  //input 输入框，要求出入年龄，位数不能超过2位；

$('#input-age').on('input',function(e){
e.preventDefault();
var a=$('#input-age').val();
var reg = /^\d+$/g;
$('#input-age').attr('type','text');
if(reg.test(e.target.value)){
if(e.target.value.length >2){
$('#input-age').val(e.target.value.slice(0,2));
}
 
}else{
if(reg.test(a.slice(0,2))){
$('#input-age').val(a.slice(0,2));
}else{
$('#input-age').val('');
}
 
}
});
 
$('#input-age').on('blur',function(e){
e.preventDefault();
$('#input-age').attr('type','number');
});