javascript表单验证使用示例(javascript验证邮箱)


Posted in Javascript onJanuary 07, 2014

被 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 相关文章推荐
很酷的javascript loading效果代码
Jun 18 Javascript
让网页根据不同IE版本显示不同的内容
Feb 08 Javascript
JavaScript代码复用模式实例分析
Dec 02 Javascript
js有序数组的连接问题
Oct 01 Javascript
EasyUI,点击开启编辑框,并且编辑框获得焦点的方法
Mar 01 Javascript
js实现鼠标经过表格行变色的方法
May 12 Javascript
JS使用正则表达式过滤多个词语并替换为相同长度星号的方法
Aug 03 Javascript
简单三步实现报表页面集成天气
Dec 15 Javascript
Jquery Easyui自定义下拉框组件使用详解(21)
Dec 31 Javascript
ios中视频的最后一桢问题解决
May 14 Javascript
vue element-ui table组件动态生成表头和数据并修改单元格格式 父子组件通信
Aug 15 Javascript
uploadify插件实现多个图片上传并预览
Sep 30 Javascript
jquery统计输入文字的个数并对其进行判断
Jan 07 #Javascript
设置jsf的选择框h:selectOneMenu为不可编辑状态的方法
Jan 07 #Javascript
javascript history对象(历史记录)使用方法(实现浏览器前进后退)
Jan 07 #Javascript
form表单action提交的js部分与html部分
Jan 07 #Javascript
javascript对话框使用方法(警告框 javascript确认框 提示框)
Jan 07 #Javascript
javascript计时器事件使用详解
Jan 07 #Javascript
javascript创建和存储cookie示例
Jan 07 #Javascript
You might like
PHP.MVC的模板标签系统(四)
2006/09/05 PHP
PHP数组 为文章加关键字连接 文章内容自动加链接
2011/12/29 PHP
解析PHP中一些可能会被忽略的问题
2013/06/21 PHP
php微信公众平台开发之获取用户基本信息
2015/08/17 PHP
PHP排序算法之希尔排序(Shell Sort)实例分析
2018/04/20 PHP
用javascript实现分割提取页面所需内容
2007/05/09 Javascript
使用自定义setTimeout和setInterval使之可以传递参数和对象参数
2009/04/24 Javascript
基于jQuery的日期选择控件
2009/10/27 Javascript
js左侧多级菜单动态的解决方案
2010/02/01 Javascript
javascript 树形导航菜单实例代码
2013/08/13 Javascript
jquery动态加载js/css文件方法(自写小函数)
2014/10/11 Javascript
jQuery焦点控制图层展示延迟隐藏的方法
2015/03/09 Javascript
详解JavaScript表单验证(E-mail 验证)
2016/03/31 Javascript
详解打造 Vue.js 可复用组件
2017/03/24 Javascript
vue中遇到的坑之变化检测问题(数组相关)
2017/10/13 Javascript
vue 引用自定义ttf、otf、在线字体的方法
2019/05/09 Javascript
vue中的循环对象属性和属性值用法
2020/09/04 Javascript
vue-cli3自动消除console.log()的调试信息方式
2020/10/21 Javascript
[02:18]《我与DAC》之工作人员:为了热爱DOTA2的玩家们
2018/03/28 DOTA
Python备份Mysql脚本
2008/08/11 Python
Python中尝试多线程编程的一个简明例子
2015/04/07 Python
举例讲解Python中的Null模式与桥接模式编程
2016/02/02 Python
python操作mysql数据库
2017/03/05 Python
python基于pyDes库实现des加密的方法
2017/04/29 Python
numpy使用技巧之数组过滤实例代码
2018/02/03 Python
详谈套接字中SO_REUSEPORT和SO_REUSEADDR的区别
2018/04/28 Python
python的pip安装以及使用教程
2018/09/18 Python
对pandas的算术运算和数据对齐实例详解
2018/12/22 Python
详解Django 时间与时区设置问题
2019/07/23 Python
Python 实现 T00ls 自动签到脚本代码(邮件+钉钉通知)
2020/07/06 Python
用python写一个带有gui界面的密码生成器
2020/11/06 Python
品质管理部岗位职责范文
2014/03/01 职场文书
2015元旦晚会主持词(开场白+结束语)
2014/12/14 职场文书
浅谈自定义校验注解ConstraintValidator
2021/06/30 Java/Android
Python 数据可视化之Matplotlib详解
2021/11/02 Python
HTTP中的Content-type详解
2022/01/18 HTML / CSS