IT基地
用户登陆
我要注册
用户名或密码错误
登 陆
注 册
IT基地 >Mr.Li的博客 >我要发文
JS对于表单中必填项的验证
作者:Mr.Li   发布时间:2017-04-11 16:13:50   点击数:2035

我们在开发过程中,经常会用到表单提交或者AJAX提交,对于表单中的文件文本等域是否为空的验证经常要用到。

这里,我整理了常用的几种表单验证的方式,记得要先引用jQuery

<form action="" method="post" onsubmit="return checkform()">
 
    普通文本框:<input type="text" name="wenben" id="wenben" >
 
    <input type="radio"  name="danxuan" id="danxuan" value="1" /> 单选1
    <input type="radio"  name="danxuan" id="danxuan" value="2" /> 单选2
    <input type="radio"  name="danxuan" id="danxuan" value="3" /> 单选3
 
    <input type="checkbox" name="fuxuan[]" id="fuxuan" value='1' /> 复选1
    <input type="checkbox" name="fuxuan[]" id="fuxuan" value='2' /> 复选2
    <input type="checkbox" name="fuxuan[]" id="fuxuan" value='3' /> 复选3
 
    <input type="submit" value="提交" />
     
</form>
 
<script>
    function checkform(){
        //普通文本框的验证
        var wenben = $('#wenben').val();
        if( wenben == '' ){
            alert('文本框不可为空');
            return false;
        }
        //单选按钮的验证
        if(!$(':radio[id=danxuan]:checked').length) {
            alert('请选择单选项');
            return false;
        }
        //复选框的验证
        var fuxuan = [];
        $('input[id="fuxuan"]:checked').each(function(){
            fuxuan.push($(this).val());
        });
        if(viparr.length == 0){
            alert("请选择复选项");
            return false;
        }
    }
</script>


本站部分数据来自软件的自动采集,仅用于学习交流,决不用于商用,如有侵犯您的合法权益,请联系我们删除。
发表技术文档,,记录个人生活,聚集意见领袖,众多IT精英,以我们的技术让开发更便捷。
IT基地版权所有,伪版必究 京ICP备17064610号-1
微信QQ空间QQ好友新浪微博FacebookTwitter
0.0116s