JavaScript教程
教程 JavaScript 简介 JavaScript 用法 JavaScript 输出 JavaScript 语法 JavaScript 语句 JavaScript 注释 JavaScript 变量 JavaScript 数据类型 JavaScript 对象 JavaScript 函数 JavaScript 作用域 JavaScript 事件 JavaScript 字符串 JavaScript 运算符 JavaScript 比较 JavaScript 条件语句 JavaScript switch 语句 JavaScript for 循环 JavaScript while 循环 JavaScript Break 和 Continue 语句 JavaScript typeof JavaScript 类型转换 JavaScript 正则表达式 JavaScript 错误 JavaScript 调试 JavaScript 表单验证 JavaScript 保留关键字 JavaScript JSON JavaScript void JS函数 JavaScript 函数定义 JavaScript 函数参数 JavaScript 函数调用 JavaScript 闭包 JS HTML DOM DOM 简介 DOM HTML DOM CSS DOM 事件 DOM EventListener DOM 元素 JS高级教程 JavaScript 对象 JavaScript Number 对象 JavaScript String JavaScript Date(日期) JavaScript Array(数组) JavaScript Boolean(布尔) JavaScript Math(算数) JavaScript RegExp 对象 JS浏览器BOM JavaScript Window JavaScript Window Screen JavaScript Window Location JavaScript Window History JavaScript Navigator JavaScript 弹窗 JavaScript 计时事件 JavaScript Cookies JS库 JavaScript 库 JavaScript 测试 jQuery JavaScript 测试 Prototype JS参考手册 JavaScript Array 对象 JavaScript Boolean 对象 JavaScript Date 对象 JavaScript Math 对象 JavaScript Number 对象 JavaScript String 对象 JavaScript RegExp 对象 JavaScript 全局属性/函数 JavaScript 运算符 Window 对象 Navigator 对象 Screen 对象 History 对象 Location 对象 HTML DOM Document 对象 HTML DOM 元素对象 HTML DOM 属性对象 HTML DOM 事件对象

JavaScript 表单验证

JavaScript表单验证


JavaScript 表单验证

JavaScript 可用来在数据被送往服务器前对 HTML 表单中的这些输入数据进行验证。

表单数据经常需要使用 JavaScript 来验证其正确性:


  • 验证表单数据是否为空?

  • 验证输入是否是一个正确的email地址?

  • 验证日期是否输入正确?

  • 验证表单输入内容是否为数字型?


必填(或必选)项目

下面的函数用来检查用户是否已填写表单中的必填(或必选)项目。假如必填或必选项为空,那么警告框会弹出,并且函数的返回值为 false,否则函数的返回值则为 true(意味着数据没有问题):

function validateForm()
{
var x=document.forms["myForm"]["fname"].value;
if (x==null || x=="")
  {
  alert("First name must be filled out");
  return false;
  }
}

以上函数在 form 表单提交时被调用:

实例

<form name="myForm" action="demo_form.asp" onsubmit="return validateForm()" method="post">
First name: <input type="text" name="fname">
<input type="submit" value="Submit">
</form>



E-mail 验证

下面的函数检查输入的数据是否符合电子邮件地址的基本语法。

意思就是说,输入的数据必须包含 @ 符号和点号(.)。同时,@ 不可以是邮件地址的首字符,并且 @ 之后需有至少一个点号:

function validateForm()
{
var x=document.forms["myForm"]["email"].value;
var atpos=x.indexOf("@");
var dotpos=x.lastIndexOf(".");
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)
  {
  alert("Not a valid e-mail address");
  return false;
  }
}

下面是连同 HTML 表单的完整代码:

实例

<form name="myForm" action="demo_form.asp" onsubmit="return validateForm();" method="post">
Email: <input type="text" name="email">
<input type="submit" value="Submit">
</form>

© 2021 jiaocheng.bubufx.com  联系我们
ICP备案:鲁ICP备09046678号-3