表单验证和正则表达式.docVIP

正则表达式和表单验证 主要内容 什么是表单的验证 表单的操作 表单的验证 正则表达式的定义 正则表达式验证 什么是表单的验证 表单的验证 在JavaScript之前，所有的验证都是发生在服务器上，增加了反应时间 使用JavaScript验证，则在数据提交到服务器端之前进行一系列的判断，比如数据不全或无效则取消提交，同时再提示重新输入. 表单的验证一般有两种形式 一个是在button按钮的onclick事件上完成，如果返回false则取消提交 在提交按钮的onsubmit事件完成，如果返回false，表单不提交 常见的验证 文本框是否为空? 选择型的表单是否选择? 用户输入的邮件地址是否合法？ 用户是否已输入合法的日期？ 表单的操作 引用表单域 根据表单的名字获取表单的引用 var myForm = doucument.forms[“name”]; 根据表单数组获取 var myForm = document.forms[0]; 表单中的属性 属性 描述 action 表单提交的服务器资源的名称，就是表单的action属性值 elements 得到一个数组，代表了表单中所有表单域的集合 encoding 返回或设置表单的MIME类型，默认为aplication/x-www-form-urlencoded length 返回该表单中表单域的数量 method 返回或设置表单的提交方法，就是表单的method属性 name 返回或设置表单的名字，相当于表单的name属性 target 返回这设置表单的提交目标，相当于表单的target属性 表单中的方法 方法 描述 submit 提交表单，相当于单击提交按钮 reset 重置表单，相当于单击重置按钮 表单中的事件 事件名 描述 onsubmit 在提交表单前，如果返回值为false，表单不能提交 onreset 在表单复位之前触发 表单域中的通用属性 disabled属性 name属性:name的属性值是可以通过JavaScript改变 form属性:通过form属性可以获得一个表单域所在的表单 value属性：用来获取表单域的值. 表单域 value的含义 文本框 文本的值 密码框 密码的值 隐藏域 Value属性的值 单选按钮 被选中的单选框的value的值，默认为on 复选按钮 被选中复选按钮的value值，默认为on 按钮 表示显示在按钮上的文字 列表框 表示选中的option元素的value值 表单域中的通用方法 focus()方法 blur()方法 表单域中的通用事件 onfocus和onblur事件 onclick、onkeydown、onkeyup和onkeypress事件 onmouseover、onmouseout、onmousedown、和onmouseup事件 onchange事件 使用文本域 获取和设置文本域的值 使用select方法选中文本 使用按钮类表单域 简单按钮:最常用的方法捕获onclick事件，然后执行代码 input type=”button”/ input type=”submit”/ input type=”reset”/ 复选按纽:通过checked属性获取，选中时是true，否则为false. 单选按钮:通过checked属性获取，选中时是true，否则为false. 使用下拉列表框 获取和设置下拉列表框的值 下拉列表框的值表示被选中的option标记的value属性 获取选项的个数 select对象有一个length属性，表示选项的个数 获取当前选项的索引 select对象中使用selectedIndex属性获取当前选中的option对象的索引 获取所有选项的集合 用options属性表示所有option组成的集合,option的value代表其值，text属性 代表其中间的文本，selected属性决定该option是否被选中 为select动态添加选项 在所有的option后面添加一个新的选项 Select.options[select.length] = new Option(“optiontext”,”value”); 从select中删除一个选项 Select.options[1] = null; 清空一个select 替换一个选项 Select.options[0] = new Option(“optiontext”,”value”); 举例 表单的验证举例 验证文本框中内容是否为空 验证选择域是否选择 验证单选按钮是否选择 正则表达式定义 什么是正则表达式 正则表达式就是一种字符串 描述字符串结构模式的表达方法 匹配字符的格式 常用的元字符 字符 说明 \ 将下一个字符标记为转义字符。如: \n, \\ ^ 匹配