jquery表单验证

1.为什么要表单验证

1. 减轻服务器的压力
2. 保证输入的数据正确性

2.常用的表单验证

1. 日期格式
2. 表单元素是否为空
3. 用户名和密码
4. E-mail地址
5. 身份证号码

3.表单验证的思路​​​​​​​

1. 获得表单元素值  用户名input
2. 使用JavaScript的一些方法对数据进行判断  非空/格式有效性验证
3. 当表单提交时，触发事件，对获取的数据进行验证

4.表单选择器

        :input

                  匹配所有input、textarea、select和button 元素  

                  $("#myform  :input")选取表单中所有的input、select和button元素

         :text                 

匹配所有单行文本框  

                  $("#myform  :text")选取email 和姓名两个input 元素

                

         :password       

                  匹配所有密码框   

                  $("#myform  :password" )选取所有<input type="password" />元素

$("#from1 :password:eq(0)").val();

         :radio      

                  匹配所有单项按钮       

                  $("#myform  :radio")选取<input type="radio" />元素

         :checkbox       

                  匹配所有复选框   

                  $(" #myform  :checkbox " )选取<input type="checkbox " />元素

         :submit   

                  匹配所有提交按钮       

                  $("#myform  :submit " )选取<input type="submit " />元素

         :image    

                  匹配所有图像域   

                  $("#myform  :image" )选取<input type=" image" />元素

         :reset      

                  匹配所有重置按钮       

                  $(" #myform  :reset " )选取<input type=" reset " />元素

         :button   

                  匹配所有按钮       

                  $("#myform  :button" )选取button 元素

         :file 

                  匹配所有文件域   

                  $(" #myform  :file" )选取<input type=" file " />元素

         :hidden   

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

                  <input type="hidden">

                  <a hidden>

                  $("#myform  :hidden" )选取<input type="hidden " />、style="display: none"等元素

属性过滤选择器

         :enabled 

                  匹配所有可用元素       

                  $(" #userform :enabled" )匹配form内部除编号输入框外的所有元素

         :disabled

                  匹配所有不可用元素  

                  $(" #userform :disabled" )匹配编号输入框

         :checked 

                  匹配所有被选中元素（复选框、单项按钮、select 中的option）     

                  $(" #userform :checked" )匹配“性别”中的“男”选项和“爱好”中的“编程”选项

         :selected

                  匹配所有选中的option 元素     

                  $(" #userform :selected" ) 匹配“家乡”中的“北京”选项

5.表单验证事件和方法

事件

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

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

         方法

                  blur()                 从文本域中移开焦点

                  focus()              在文本域中设置焦点，即获得鼠标光标

                  select()    选取文本域中的内容，突出显示输入区域的内容