js表单

HTML 表单验证可以通过 JavaScript 来完成。

数据验证

数据验证用于确保用户输入的数据是有效的。

典型的数据验证有：

• 必需字段是否有输入?
• 用户是否输入了合法的数据?
• 在数字字段是否输入了文本?

大多数情况下，数据验证用于确保用户正确输入数据。

数据验证可以使用不同方法来定义，并通过多种方式来调用。

HTML 约束验证

HTML5 新增了 HTML 表单的验证方式：约束验证（constraint validation）。

约束验证是表单被提交时浏览器用来实现验证的一种算法。

HTML 约束验证基于：

• HTML 输入属性
• CSS 伪类选择器
• DOM 属性和方法

•                                                                                                                  约束验证 HTML 输入属性

• disabled	规定输入的元素不可用
  max	规定输入元素的最大值
  min	规定输入元素的最小值
  pattern	规定输入元素值的模式
  required	规定输入元素字段是必需的
  type	规定输入元素的类型

•                                                                                                                 约束验证 CSS 伪类选择器

• :disabled	选取属性为 "disabled" 属性的 input 元素
  :invalid	选取无效的 input 元素
  :optional	选择没有"optional"属性的 input 元素
  :required	选择有"required"属性的 input 元素
  :valid	选取有效值的 input 元素

• JavaScript 实例

  function validateForm() { var x = document.forms["myForm"]["fname"].value; if (x == null || x == "") { alert("需要输入名字。"); return false; } }