当前位置: 移动技术网 > IT编程>开发语言>Jquery > 前端提交表单两种验证方式记录 jq或h5 required属性

前端提交表单两种验证方式记录 jq或h5 required属性

2018年12月13日  | 移动技术网IT编程  | 我要评论
JQuery: HTML5 required属性: ...

jquery:

<form id="form">
    <input type="text" name="aaa">
    <select name="bbb">
        <option value="">请选择</option>
        <option value="1">选项1</option>
        <option value="2">选项2</option>
        <option value="3">选项3</option>
    </select>
    <button type="button" id="submit">提交</button>
</form>
//提交表单
$('#submit').click(function(){
    var data = {};
    var t = $('#form').serializearray();
    $.each(t, function() {
        data [this.name] = this.value;
    });
    console.log(data);
    if(data.aaa == ''){alert("aaa不能为空!");return false;}
    if(data.bbb == ''){alert("bbb不能为空!");return false;}
    $('#form').submit();
});

html5 required属性:

<input type="text" name="aaa" required="required">
<select name="bbb" required="required">
    <option value="">请选择</option>
    <option value="1">选项1</option>
    <option value="2">选项2</option>
    <option value="3">选项3</option>
</select>
    
<button type="submit">提交</button>

 

如您对本文有疑问或者有任何想说的,请点击进行留言回复,万千网友为您解惑!

相关文章:

验证码:
移动技术网