表单验证及正则表达式

表单基本验证技术：为什么要进行表单验证？：减轻服务器压力

                                                                            保证输入数据符合要求

                                 常用的表单验证：日期 格式

                                                              表单元素是否为空

                                                             用户名和密码

                                                              Email地址

                                                              身份证号

                                 常用的表单选择器：input：匹配所有input，textarea，select和button元素

                                                                text：匹配所有单行文本框

                                                                 password：匹配所有密码框

                                                               radio：匹配所有单选按钮

                                                               checkbox：匹配所有复选框

                                                               submit：提交按钮

                                                                image：图像域

                                                              reset：重置按钮

                                                                button：所有按钮

                                                                file：文件域

                                                               hidden：匹配所有不可见 元素，或者type为hidden的元素

                                 属性过滤选择器：enabled：匹配所有可用元素

                                                              disabled：匹配 所有不可用元素

                                                              checked：匹配所有被选中元素

                                                             selected：匹配所以option元素

 

                               非空验证：

if (mail == "") {
     alert("Email不能为空");
     return

 

                               字符串查找：indexOf()：查找某个指定的字符串值在字符串中首次出现的位置

实例展示

$("form").submit(function(){
    var mail = $("#myform :text").val();
    if (mail=="") {//检测Email是否为空
        alert("Email不能为空");
        return false;
    }
    if (mail.indexOf("@") == -1) {
        alert("Email格式不正确\n必须包含@");
        return false;
    }
    if (mail.indexOf(".") == -1) {
        alert("Email格式不正确\n必须包含.");
        return false;
    }
    return true;
})

                        长度验证

实例展示：

if(pwd.length<6){
    alert("密码必须等于或大于6个字符");
    return false;
}

                       判断字符串是否有数字：使用for循环和substring()方法依次截取单个字符，再判断每个字符是否是数字

实例展示

for (var i = 0; i < user.length; i++) {
    var j = user.substring(i, i + 1);
    if (isNaN(j) == false) {
        alert("姓名中不能包含数字");
        return false;
    }
}

var pwd = $("#pwd").val();
if (pwd == "") {
       alert("密码不能为空");
       return false;
}
if (pwd.length < 6) {
       alert("密码必须等于或大于6个字符");
       return false;
}
var repwd = $("#repwd").val();
if (pwd != repwd) {
      alert("两次输入的密码不一致");
      return false;

r user = $("#user").val();
      if (user == "") {
         alert("姓名不能为空");
         return false;
}
for (var i = 0; i < user.length; i++) {
         var j = user.substring(i, i + 1);
          if (isNaN(j) == false) {   
    alert("姓名中不能包含数字");
               return false;
          }
}

表单验证事件和方法

 

 

正则表达式

使用HTML5方式验证表单