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 相关文章推荐
符合W3C网页标准的iframe标签的使用方法
Jul 19 Javascript
判断JS对象是否拥有某种属性的两种方式
Dec 02 Javascript
javascript自定义函数参数传递为字符串格式
Jul 29 Javascript
深入理解JavaScript系列(41):设计模式之模板方法详解
Mar 04 Javascript
每日十条JavaScript经验技巧(二)
Jun 23 Javascript
基于Phantomjs生成PDF的实现方法
Nov 07 Javascript
JS与jQuery实现子窗口获取父窗口元素值的方法
Apr 17 jQuery
JS原生数据双向绑定实现代码
Aug 14 Javascript
AngularJS使用ng-repeat遍历二维数组元素的方法详解
Nov 11 Javascript
基于node搭建服务器,写接口,调接口,跨域的实例
May 13 Javascript
vue-router 源码之实现一个简单的 vue-router
Jul 02 Javascript
如何使用CSS3和JQuery easing 插件制作绚丽菜单
Jun 18 jQuery
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中的integer类型使用分析
2010/07/27 PHP
关于php循环跳出的问题
2013/07/01 PHP
PHP网页游戏学习之Xnova(ogame)源码解读(十一)
2014/06/25 PHP
Zend Framework上传文件重命名的实现方法
2016/11/25 PHP
PHPstorm快捷键(分享)
2017/07/17 PHP
JavaScript ECMA-262-3 深入解析.第三章.this
2011/09/28 Javascript
jquery事件重复绑定的快速解决方法
2014/01/03 Javascript
无刷新上传文件并返回自定义值
2015/06/11 Javascript
分步解析JavaScript实现tab选项卡自动切换功能
2016/01/25 Javascript
基于jQuery实现select下拉选择可输入附源码下载
2016/02/03 Javascript
Vue.js如何实现路由懒加载浅析
2017/08/14 Javascript
JavaScript变量声明var,let.const及区别浅析
2018/04/23 Javascript
es6中比较有用的7个技巧小结
2019/07/12 Javascript
原生js实现的移动端可拖动进度条插件功能详解
2019/08/15 Javascript
js实现mp3录音通过websocket实时传送+简易波形图效果
2020/06/12 Javascript
python连接mysql数据库示例(做增删改操作)
2013/12/31 Python
Django的数据模型访问多对多键值的方法
2015/07/21 Python
使用python将请求的requests headers参数格式化方法
2019/01/02 Python
Tensorflow实现神经网络拟合线性回归
2019/07/19 Python
Python 文件数据读写的具体实现
2020/01/24 Python
Python面向对象程序设计之私有变量,私有方法原理与用法分析
2020/03/23 Python
python中对二维列表中一维列表的调用方法
2020/06/07 Python
欧洲高端品牌直销店:Fashionesta
2016/08/31 全球购物
毕业生求职简历中的自我评价
2013/10/18 职场文书
专科文秘应届生求职信
2013/11/18 职场文书
临床医师专业个人自我评价
2014/01/08 职场文书
大学生个人求职口试自我评价
2014/02/16 职场文书
合同协议书格式
2014/04/18 职场文书
学生党员检讨书范文
2014/12/27 职场文书
公务员年度考核个人总结
2015/02/12 职场文书
出纳岗位职责范本
2015/03/31 职场文书
四年级数学教学反思
2016/02/16 职场文书
90条交通安全宣传标语
2019/10/12 职场文书
MySQL 常见存储引擎的优劣
2021/06/02 MySQL
《勇者辞职不干了》ED主题曲无字幕动画MV公开
2022/04/13 日漫
使用compose函数优化代码提高可读性及扩展性
2022/06/16 Javascript