zoukankan      html  css  js  c++  java
  • js表单验证

    <div class="addDIV">
    
        <div class="panel panel-success">
            <div class="panel-heading">
                <h3 class="panel-title" style="text-align:center">增加学生</h3>
            </div>
            <div class="panel-body">
    
                <form method="post" id="addForm" onsubmit="return validateForm();" role="form">
                    <table class="addTable">
                        <tr>
                            <td>学号:</td>
                            <td><input type="text" name="student_id" id="student_id" placeholder="请在这里输入学号"></td>
                        </tr>
                        <tr>
                            <td>姓名:</td>
                            <td><input type="text" name="name" id="name" placeholder="请在这里输入名字"></td>
                        </tr>
                        <tr>
                            <td>年龄:</td>
                            <td><input type="text" name="age" id="age" placeholder="请在这里输入年龄"></td>
                        </tr>
                        <tr>
                            <td>性别:</td>
                            <td><input type="radio" checked class="radio radio-inline" name="sex" value=""><input type="radio" class="radio radio-inline" name="sex" value=""></td>
                        </tr>
                        <tr>
                            <td>出生日期:</td>
                            <td><input type="date" name="birthday" id="birthday" placeholder="请在这里输入出生日期"></td>
                        </tr>
                        <tr class="submitTR">
                            <td colspan="2" align="center">
                                <button type="submit" class="btn btn-success">提 交</button>
                            </td>
    
                        </tr>
    
                    </table>
                </form>
            </div>
        </div>
    
    </div>

    第一种验证

    //表单验证 是否为空 为空则提示,不为空则ajax提交数据
     function validateForm(){
    //验证学号
    if($("#student_id").val()==""||$("#student_id").val()==null){
    alert("学生id不能为空");
    return false;
    }
    //验证姓名
    if($("#name").val()==""||$("#name").val()==null){
    alert("学生姓名不能为空");
    return false;
    }
    //年龄
    if($("#age").val()==""||$("#age").val()==null){
    alert("学生年龄不能为空");
    return false;
    }
    //出生日期
    if($("#birthday").val()==""||$("#birthday").val()==null){
    alert("学生出生日期不能为空");
    return false;
    }
    //调用ajax提交到controller
    return addStudent();
    } 

    第二种验证

        $.fn.validate = function(tips){
    
               if($(this).val() == "" || $.trim($(this).val()).length == 0){
                   alert(tips + "不能为空!");
                   return false; //如果验证不通过,则不执行后面
               }
               return true;
           }
           function validateForm(){
               //调用validate()
               var s_id = $("#student_id").validate("学号");
               var s_name = $("#name").validate("姓名");
               var s_age = $("#age").validate("年龄");
               var s_birth = $("#birthday").validate("生日");
               var bool= s_id && s_name && s_age && s_birth;
               return addStudent(bool);
           }
     
           //提交表单数据到controller
           function addStudent(bool){
               if(bool){
                   alert("snd");
               }
               
           } 
  • 相关阅读:
    oracle常用hint的用法
    浅谈reverse函数与django哲学
    javascript console
    python os.path模块
    删除列表元素
    Python模块学习 pickle, cPickle 对象序列化/反序列化
    Python中zip()函数用法举例
    Python 字符串方法详解
    常用正则验证
    python中下划线的用法
  • 原文地址:https://www.cnblogs.com/19322li/p/11089157.html
Copyright © 2011-2022 走看看