jquery 实现input只输入数字及控制输入字数

id:<input  type="text" name="id" id="id" >
<span style="display:none;border:0" id="t1" >请输入数字</span>
<script type="text/javascript">
$("#id").keyup(function(){
    	var c=$(this);
    	if(/[^\d]/.test(c.val())){
    		var temp=c.val().replace(/[^\d]/g,'');
    		$(this).val(temp);
    		$("#t1").css({'display':'block'});
    	}else{
    		$("#t1").css({'display':'none'});
    	}
</script>

这样就实现了输入框里只能输入数字,当输入的不是数字时就会提示 “输入数字”并清空输入框里的内容。

控制输入长度也类似

用户名:<input type="text" name="username" id="username" >
<span style="display:none;border:0;float:right;margin-right:50px" id="t2" >用户名长度为3-6位</span>
$("#username").blur(function(){
    	
    		var d=$(this);
    		if(d.val().length<3||d.val().length>6){
    			
    		 $(this).val('');
    		
    		 $("#t2").css({'display':'block'});
        	}else{
        		$("#t2").css({'display':'none'});
    		}
    	})

.blur事件是失去焦点事件,当输入框失去焦点即光标移出输入框就会执行此函数

.val()是jq获取元素的值的函数

如果不用jq,实现input只输入数字方法如下:

id:<input type="text" name="id" id="id" οnkeyup="value=value.replace(/[^\d]/g, '')"/><br />
直接如此即可。


       

展开阅读全文
©️2020 CSDN 皮肤主题: 大白 设计师: CSDN官方博客 返回首页
实付0元
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值