JavaScript 表单验证

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

被 JavaScript 验证的这些典型的表单数据有：

  • 用户是否已填写表单中的必填项目？
  • 用户输入的邮件地址是否合法？
  • 用户是否已输入合法的日期？
  • 用户是否在数据域 (numeric field) 中输入了文本？

必填（或必选）项目

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

function validate_required(field,alerttxt)

{

with (field)

{

if (value==null||value=="")

  {alert(alerttxt);return false}

else {return true}

}

}

E-mail 验证

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

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

function validate_email(field,alerttxt)

{

with (field)

{

apos=value.indexOf("@")

dotpos=value.lastIndexOf(".")

if (apos<1||dotpos-apos<2)

  {alert(alerttxt);return false}

else {return true}

}

}

实例:

<html>

<head>

<script type="text/javascript">

function validate_email(field,alerttxt)

{

with (field)

{

apos=value.indexOf("@")

dotpos=value.lastIndexOf(".")

if (apos<1||dotpos-apos<2)

  {alert(alerttxt);return false}

else {return true}

}

}

function validate_form(thisform)

{

with (thisform)

{

if (validate_email(email,"Not a valid e-mail address!")==false)

  {email.focus();return false}

}

}

</script>

</head>

<body>

<form action="submitpage.htm"onsubmit="return validate_form(this);" method="post">

Email: <input type="text" name="email" size="30">

<input type="submit" value="Submit">

</form>

</body>

</html>

JavaScript 表单验证入门的更多相关文章

  1. JavaScript表单验证年龄

    JavaScript表单验证年龄,判断一个输入量是否符合年龄,通过正则表达式实现. //检查年龄 function isAge(str){ var mydate=new Date; var now=m ...

  2. 前端工具 - 15个最佳的 JavaScript 表单验证库

    客户端验证在任何项目都是不够的,因为 JavaScript 可以直接忽略,人们可以提交请求到服务器. 然而这并不意味着客户端验证都没必要了,很多时候我们需要在用户提交到服务器之前给予提示.JavaSc ...

  3. JavaScript表单验证和正则表达式

    JavaScript表单验证 分为四类: 1.非空验证 常用于用户名等 2.相等验证 常用于验证两次输入的密码 3.范围验证 常用于年龄等 4.正则验证 用于手机号,邮箱号等 以下是实例: <! ...

  4. 15个最佳的 JavaScript 表单验证库

    客户端验证在任何项目都是不够的,因为 JavaScript 可以直接忽略,人们可以提交请求到服务器. 然而这并不意味着客户端验证都没必要了,很多时候我们需要在用户提交到服务器之前给予提示.JavaSc ...

  5. JavaScript 表单验证 案例

    JavaScript 表单验证 案例 版权声明:未经授权,严禁转载!   编写 HTML 文件,搭建主体界面 <html> <head> <meta charset=&q ...

  6. 10个强大的Javascript表单验证插件推荐

    创建一个JavaScript表单验证插件,可以说是一个繁琐的过程,涉及到初期设计.开发与测试等等环节.实际上一个优秀的程序员不仅是技术高手,也应该是善假于外物的.本文介绍了10个不错的JavaScri ...

  7. JavaScript 表单验证正则表达式大全

    JavaScript 表单验证正则表达式大全[转载] 匹配中文字符的正则表达式: [u4e00-u9fa5] 评注:匹配中文还真是个头疼的事,有了这个表达式就好办了 匹配双字节字符(包括汉字在内):[ ...

  8. javascript表单验证

    表单HTML <form action="" method="post"> <fieldset class="login" ...

  9. JavaScript表单验证实例

    1. 长度限制<script>function test(){if(document.a.b.value.length>50){alert("不能超过50个字符!" ...

随机推荐

  1. 10 个非常有用的 SVG 动画的 JavaScript 库

    SVG 通常可以用作跨分辨率视频.这意味着在一块高分屏幕上不会降低图片的锐度.此外,你甚至可以让SVG动起来,通过使用一些javascript类库.下面,我们分享一些javascript类库,这些类库 ...

  2. 揭秘uc浏览器三

    这节我们主要讨论收藏与历史记录页面的边边角角. 首先,看看他的最终的效果图了: 照例了,我们先看看他的布局文件: <!-- tab布局文件 --> <TabHost xmlns:an ...

  3. capwap学习笔记——初识capwap（二）

    2.5.1 AC发现机制 WTP使用AC发现机制来得知哪些AC是可用的,决定最佳的AC来建立CAPWAP连接. WTP的发现过程是可选的.如果在WTP上静态配置了AC,那么WTP并不需要完成AC的发现 ...

  4. 下周二推出“音视频技术WebRTC初探”公开课，欢迎捧场！

     下周二推出"音视频技术WebRTC初探"公开课,欢迎捧场! 公开课课程链接:http://edu.csdn.net/huiyiCourse/detail/90 课程的解说资料 ...

  5. 抽屉柜式MCC柜中PROFIBUS设备推荐波特率及相应传输距离

    抽屉柜式MCC柜中PROFIBUS设备推荐波特率及相应传输距离.例如以下图所看到的: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L ...

  6. 免费素材：气球样式的图标集（PSD, SVG, PNG）

    本地下载 一套30枚设计精良的气泡式圆形图标,两种款式供您选择,相信你会喜欢!

  7. .Net 如何实现 LINQ~

    本文内容 引入 实现 LINQ 的两个前提 扩展方法 λ 表达式 LINQ 参考资料 本文说明 LINQ 是如何实现的,知道这点,才能更好地使用它~ 如果你刚接触 LINQ,那么可能不会那么快就理解. ...

  8. PDF文档输出

    参考:http://ajava.org/article-685-1.html Flexpaper> 参数说明: Flexpaper参数说明SwfFile (String) 需要使用Flexpap ...

  9. 数据对接—kettle使用之四

    上一篇介绍了表输出插件,并通过实例介绍插件的简单使用,如果有这样的需求大家可以参考一下并深入研究插件的其它细节设置.这一篇我们介绍和表输出对应的插件(表输入)的使用. 表输入: 1. 从步骤插入数据: ...

  10. DbScopeFactory

    using (var db = DbScopeFactory.Create()) { //这里修改数据 db.SaveChanges(); }