非空校验,包括无输入及连续输入多个空格

在表格提交之前,我们通常要对表格内容做非空验证,非空验证包括空值校验和是否连续空格检验

通常的验证方法就是直接给 input输入框 添加 required 属性 这是个 h5 的新属性,浏览器自行进行非空校验

但对于某些不能很好的支持 h5 新属性或者某些需要异步提交的表单。(PS:要注意的是,required属性是针对form表单的,即如果你的输入框不在form表单内,且没有submit按钮,该属性是不起作用的)

对于某些不在form表单内的输入框的值,那么就需要我们自行进行判断了。

在此我写一个简单的校验函数:

html代码:

<input type="text" id="test1" required="required"/>
<input type="button" name="btn" id="btn" value="check" />

js代码:

var val = document.getElementById('test1'); 
var btn = document.getElementById('btn');
var regu = "^[ ]+$"; //正则匹配一个或多个空格
var re = new RegExp(regu);
btn.addEventListener('click',function(){
	var is_null = re.test(val.value);
	if(is_null||val.value==''){
		console.log('不可为空')
	}else{
		console.log('OkFine');
	}
});

这里我用到正则“^[ ]+$”进行检验  做下简单的解释  ^为起始标记符。$为结束标记符。[ ]为字符匹配条件,当前字符为空,即匹配空格。+为匹配一个或多个[ ]内的字符。



 

  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值