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 未结束的字符串常量常见解决方法
Jan 24 Javascript
判断js对象是否拥有某一个属性的js代码
Aug 16 Javascript
一个简单的实现下拉框多选的插件可移植性比较好
May 05 Javascript
avalon js实现仿google plus图片多张拖动排序附源码下载
Sep 24 Javascript
使用js获取地址栏参数的方法推荐(超级简单)
Jun 14 Javascript
JS动态遍历json中所有键值对的方法(不知道属性名的情况)
Dec 28 Javascript
jquery实现焦点轮播效果
Feb 23 Javascript
JS中去掉array中重复元素的方法
May 26 Javascript
详解使用webpack构建多页面应用
Dec 21 Javascript
使用Angular CLI生成 Angular 5项目教程详解
Mar 18 Javascript
postman+json+springmvc测试批量添加实例
Mar 31 Javascript
微信自定义分享链接信息(标题,图片和内容)实现过程详解
Sep 04 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
Yii PHP Framework实用入门教程(详细介绍)
2013/06/18 PHP
PHP利用缓存处理用户注册时的邮箱验证,成功后用户数据存入数据库操作示例
2019/12/31 PHP
firefox浏览器下javascript 拖动层效果与原理分析代码
2007/12/04 Javascript
js中的布尔运算符使用介绍
2013/11/20 Javascript
setInterval计时器不准的问题解决方法
2014/05/08 Javascript
js实现回放拖拽轨迹从过程上进行分析
2014/06/26 Javascript
JSON相关知识汇总
2015/07/03 Javascript
整理Javascript流程控制语句学习笔记
2015/11/29 Javascript
jQuery中ajax的load()与post()方法实例详解
2016/01/05 Javascript
使用JS 插件qrcode.js生成二维码功能
2017/02/20 Javascript
Bootstrap Paginator+PageHelper实现分页效果
2018/12/29 Javascript
Vue.js样式动态绑定实现小结
2019/01/24 Javascript
Node.js如何对SQLite的async/await封装详解
2019/02/14 Javascript
vue引用外部JS的两种种方法
2020/01/28 Javascript
解决vue页面刷新,数据丢失的问题
2020/11/24 Vue.js
Python实现的Kmeans++算法实例
2014/04/26 Python
Python标准库之随机数 (math包、random包)介绍
2014/11/25 Python
Python bsddb模块操作Berkeley DB数据库介绍
2015/04/08 Python
python实现查找两个字符串中相同字符并输出的方法
2015/07/11 Python
Python使用logging结合decorator模式实现优化日志输出的方法
2016/04/16 Python
利用python实现命令行有道词典的方法示例
2017/01/31 Python
wx.CheckBox创建复选框控件并响应鼠标点击事件
2018/04/25 Python
Python使用爬虫抓取美女图片并保存到本地的方法【测试可用】
2018/08/30 Python
为什么str(float)在Python 3中比Python 2返回更多的数字
2018/10/16 Python
详解Python网络框架Django和Scrapy安装指南
2019/04/01 Python
完美解决python3.7 pip升级 拒绝访问问题
2019/07/12 Python
python 利用matplotlib在3D空间中绘制平面的案例
2021/02/06 Python
CSS3旋转——彩色扇子兼容firefox浏览器
2013/06/04 HTML / CSS
亚马逊西班牙购物网站:amazon西班牙
2017/03/06 全球购物
.net C#面试题
2012/08/28 面试题
大学军训感言
2014/01/10 职场文书
学校联谊活动方案
2014/02/15 职场文书
中共广东省委常委会党的群众路线教育实践活动整改方案
2014/09/23 职场文书
关于观后感的作文
2015/06/18 职场文书
2019通用版劳动合同范本!
2019/07/11 职场文书
python基础之模块的导入
2021/10/24 Python