表单校验

表单验证的必要性：

使用JavaScript可以十分便捷的进行表单验证，他不但能检查用户输入的无效或错误数据，还能检查用户遗漏的必选项，

从而减轻服务器端的压力，避免服务器端的信息出现错误。

客户端验证：

在已下载的页面中，当用户提交表单的时候，他直接在页面中调用脚本来进行验证，这样可以减少服务器端的运算。

服务器端验证：

将页面提交到服务器，由服务器端的程序对提交的表单进行验证，然后再返回响应结果到客户端。

验证表单的合法性：

1>首先获取表单元素的值，这些值一般都是String类型，包含数字，下划线等。

2>使用JavaScript中的一些方法对获取的String类型的数据进行判断。

3>表单form有一个事件onsubmit，他是在提交表单之前调用的，因此可以在提交表单时出发onsubmit事件，然后对获取的数据进行验证。

检验邮箱中是否含有@和.

 function checkEmail(){
        var flag=true;
        var dom = $("[id=email]");
        var value = dom.val();
        if (value.indexOf("@")==-1) {
            alert('邮箱中必须包含@');
            flag = false;
        }
        if (value.indexOf(".") == -1) {
            alert('邮箱中必须包含.');
            flag = false;
        }
        return flag;
        }
        $(function () {
            var myform = $("form");
            myform.submit(function () {
                return checkEmail();
            });
        });

换对焦后：

  function checkEmail(num) {
            var email = $("[id=email]").val().length;
            if (email<6) {
                $("#semail").text("邮箱不合格");
                num = 1;
            } else {
                $("#semail").text("√");
            }
            return num;
        }
        function checkPwd(num) {
            var pwd = $("[id=pwd]").val().length;
            if (pwd<6) {
                $("#spwd").text("密码不合格");
                num = 1;
            } else {
                $("#spwd").text("√");
            }
            return num;
        }
        $(function () {
            $("[id=email]").blur(function () {
                checkEmail();
            });
        });
        $(function () {
            $("form").submit(function () {
                var num1 = checkEmail(0);
                var num2 = checkPwd(0);
                var sum = num1 + num2;
                if (sum > 0) {
                    return false;
                }
                return true;
            });
        });

事件：

onblur：失去焦点后，当光标离开某个文本框后时触发。

onfocus：获得焦点后，当光标进入文本框后时触发。

方法：

blur（）：从文本域移开焦点。

focus（）：在文本域中设置焦点，即获得鼠标光标。

select（）：选取文本域中的内容，突出显示输入区域的内容。

正则表达式：

正则表达式是一个描述字符模式的对象，他是由一些特殊的符号组成的，这些符号和在SQLServer中学过的通配符一样，其

组成的字符模式用来匹配各种表达式。

语法：

var reg=/表达式/附加参数

表达式：一个字符串代表了某种规则，其中可以使用某些特殊字符来代表特殊的规则。

附加参数：

g:代表可以进行全局匹配

i：代表不区分大小写匹配

m：代表可以进行多行分配

构造函数：

var reg=new RegExp（“表达式“，”附加参数”）；

模式：

简单模式：通过普通字符的组合来表达的模式

符合模式：含有通配符来表达的模式

test（）方法用于检测一个字符串是否匹配某个模式

语法：

正则表达式对象实例.test（字符串）

表单选择器：

用来选择文本输入框。

jQuery表单过滤选择器

表单对象属性过滤选择器

选择器                 描述                                              返回                示例

:enabled              选择所有可用元素                          集合元素         $("#form1  :enabled");选取ID为"form1"的表单内的所有可用元素

:disabled             选取所有不可用元素                       集合元素         $(#form2   :disabled);选取id为"from2"的表单内的所有不可用元素

:checked             选取所有被选中的元素                   集合元素         $("input:checked")选取所有被选中的<input>元素

:selected            选取所有被选中的选项元素（下拉）集合元素        $("select:selected");选取所有被选中的选项元素

表单对象属性过滤示例

选择器材             描述                                                 返回                示例

:input                    选取所有的<input>,<textarea>         集合元素         $(":input")选取所有<input>,<textarea>.<select>和<button>元素

                             <select>和<button>元素

text                      选取所有的单选文本框                     集合元素         $(":text")选取所有的单选文本框

password            选取所有的密码框                            集合元素          $(":password")选取所有的密码框

radio                选取所有的单选框                            集合元素          $(":radio")选取所有的单选框

checkbox            选取所有的多选框                            集合元素          $(":checkbox");选取所有的复选框

submit                选取所有的提交按钮                         集合元素           $(":submit")选取所有的提交按钮

image                 选取所有的图像按钮                         集合元素           $(":image");选取所有的图像按钮

reset                  选取所有的重置按钮                         集合元素           $(":reset");选取所有的重置按钮

button                选取所有的按钮                                集合元素            $(":button"); 选取所有的按钮

file                   选取所有的上传域                             集合元素            $(":hidden")选取所有不可见元素