在标签上设置了required属性submit提交时是会执行submit方法体的。
<form id="form_container2" style="padding-top: 25px;">
<input type="text" class="form-control" value="admin" placeholder="用户名" id="regist_account" name="regist_account" required />
<input type="password" class="form-control" placeholder="密码" id="regist_password1" name="regist_password1" required />
<input type="submit" value="注册" class="btn btn-success" id="regist_btn" />
</form>
$("#regist_btn").click(function(){ //注册
var params = $("#form_container2").serialize();
$.post("./user/saveUser",params,function(res){});
});
界面上会给提示说内容不为空,但还是执行了方法体中的内容。
所以在方法体中我们需要对required属性做一个判断
我们可以自己新建一个js文件用来单独保存以下的方法。方便在其他的地方引用,就不用重复的在每个页面上写了。
我这里将他保存在了util.js下面。只要在需要的界面引用他就可以了。
<script src="./js/util.js"></script>
function notNull(){//非空判断方法
var notNullFlag;
var strName = $("[required]").serialize();//获取到required属性中所有的name属性
var strArr = strName.split("&");
var arrList = new Array();//为什么要新建一个数组:需要对strArr分割后的数据进行处理
for(var i=0;i<strArr.length;i++){
arrList.push(strArr[i].substring(0, strArr[i].indexOf("=")))//为什么要截取字符:因为serialize的数据后面带=value值
if($("#"+arrList[i]).val()==""){
notNullFlag = false;
break;//防止只有最后一个有值;
}else{
notNullFlag = true;
}
}
return notNullFlag;
}
这样我们只要在submit方法体中加入if notNull判断就可以了
$("#regist_btn").click(function(){ //注册
var params = $("#form_container2").serialize();
if(notNull()){
$.post("./user/saveUser",params,function(res){});
}
});