JavaScript简单验证表单空值及邮箱格式的方法


Posted in Javascript onJanuary 20, 2017

本文实例讲述了JavaScript简单验证表单空值及邮箱格式的方法。分享给大家供大家参考,具体如下:

运行效果图如下:

JavaScript简单验证表单空值及邮箱格式的方法

具体代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="zh-cn" />
<title>Javascript 表单验证</title>
<body>
 <h3>(一)验证必填项是否有空值。</h3>
 <form action = "submitpage.html" onsubmit = "return validate_form(this)" method = "post">
 Name:<input type = "text" name = "name" size = "20">
 <input type = "submit" value = "Submit">
 </form>
 <h3>(二)验证Email格式是否正确。</h3>
 <form action = "submitpage.html" onsubmit = "return is_email_form(this)" method = "post">
 Email:<input type = "text" name = "email" size = "20">
 <input type = "submit" value = "OK">
 </form>
 <script>
//判断内容是否为空
 function validate_form(thisform){
  with (thisform){
   if (!validate_required(name,"Name must be filled out!")){
    name.focus();
    return false
   }
  }
 }
 function validate_required(field,alerttxt){
   with (field){
    if (value==null||value==""){
     alert(alerttxt);
     return false
    }else {
     return true
    }
   }
  }
//判断内容是否符合email的格式
function is_email_form(thisform){
 with(thisform){
  if(!checkEmail(email,"Not a valid e-mail address!")){
   email.focus();
   return false;
  }
 }
}
function checkEmail(field, alertText){
 with(field){
  apos = value.indexOf("@");
  dotPos = value.indexOf(".");
  if(apos<1 || dotPos-apos<2){
   alert(alertText);
   return false;
  }else{
   return true;
  }
 }
}
 </script>
</body>
</html>

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
jQuery实现圣诞节礼物传送(花式轮播)
Dec 25 Javascript
详解js的异步编程技术的方法
Feb 09 Javascript
基于jquery实现多选下拉列表
Aug 02 jQuery
微信小程使用swiper组件实现图片轮播切换显示功能【附源码下载】
Dec 12 Javascript
详解jquery和vue对比
Apr 16 jQuery
如何使用Node.js爬取任意网页资源并输出PDF文件到本地
Jun 17 Javascript
JS实现的简单tab切换功能完整示例
Jun 20 Javascript
解决Vue打包后访问图片/图标不显示的问题
Jul 25 Javascript
vue和iview实现Scroll 数据无限滚动功能
Oct 31 Javascript
微信小程序利用云函数获取手机号码
Dec 17 Javascript
在vue中使用eslint,配合vscode的操作
Nov 09 Javascript
js实现随机点名功能
Dec 23 Javascript
JavaScript基于Dom操作实现查找、修改HTML元素的内容及属性的方法
Jan 20 #Javascript
BootStrap CSS全局样式和表格样式源码解析
Jan 20 #Javascript
BootStrap 图片样式、辅助类样式和CSS组件的实例详解
Jan 20 #Javascript
Javascript DOM事件操作小结(监听鼠标点击、释放,悬停、离开等)
Jan 20 #Javascript
JS中from 表单序列化提交的代码
Jan 20 #Javascript
jquery表单验证插件validation使用方法详解
Jan 20 #Javascript
jquery表单插件form使用方法详解
Jan 20 #Javascript
You might like
在IIS7.0下面配置PHP 5.3.2运行环境的方法
2010/04/13 PHP
php常用文件操作函数汇总
2014/11/22 PHP
Yii2超好用的日期和时间组件(值得收藏)
2016/05/05 PHP
ExtJS TabPanel beforeremove beforeclose使用说明
2010/03/31 Javascript
基于jquery的放大镜效果
2012/05/30 Javascript
javascript实现tabs选项卡切换效果(自写原生js)
2013/03/19 Javascript
javascript中简单的进制转换代码实例
2013/10/26 Javascript
JavaScript实现信用卡校验方法
2015/04/07 Javascript
JavaScript中有关一个数组中最大值和最小值及它们的下表的输出的解决办法
2016/07/01 Javascript
Vue.js每天必学之指令系统与自定义指令
2016/09/07 Javascript
Vue组件选项props实例详解
2017/08/18 Javascript
vue element项目引入icon图标的方法
2018/06/06 Javascript
通过jquery的ajax请求本地的json文件方法
2018/08/08 jQuery
vue 点击按钮实现动态挂载子组件的方法
2018/09/07 Javascript
帮你彻底搞懂JS中的prototype、__proto__与constructor(图解)
2019/08/23 Javascript
基于JS实现简单滑块拼图游戏
2019/10/12 Javascript
微信小程序实现锚点功能
2019/11/20 Javascript
原生js中运算符及流程控制示例详解
2021/01/05 Javascript
[02:15]2015国际邀请赛选手档案IG.Ferrari 430
2015/07/30 DOTA
Windows下Python2与Python3两个版本共存的方法详解
2017/02/12 Python
使用Python对SQLite数据库操作
2017/04/06 Python
Python文件读写常见用法总结
2019/02/22 Python
Python简单处理坐标排序问题示例
2019/07/11 Python
django 多对多表的创建和插入代码实现
2019/09/09 Python
10个python3常用排序算法详细说明与实例(快速排序,冒泡排序,桶排序,基数排序,堆排序,希尔排序,归并排序,计数排序)
2020/03/17 Python
Python爬虫使用bs4方法实现数据解析
2020/08/25 Python
python实现AdaBoost算法的示例
2020/10/03 Python
Python 爬虫批量爬取网页图片保存到本地的实现代码
2020/12/24 Python
Fossil美国官网:Fossil手表、手袋、珠宝及配件
2017/02/01 全球购物
美国杰西潘尼官网:JCPenney
2019/06/12 全球购物
《少年王冕》教学反思
2014/04/11 职场文书
党员检讨书
2014/10/13 职场文书
大学生暑假实习总结
2015/07/13 职场文书
2016年学校十一国庆节活动总结
2016/04/01 职场文书
PostgreSQL通过oracle_fdw访问Oracle数据的实现步骤
2021/05/21 PostgreSQL
Java 超详细讲解十大排序算法面试无忧
2022/04/08 Java/Android