定义:对于一个HTML页面中的表单,可以获取其中的各项表单域信息,

   利用这些信息,可以判定个表单域所提供的输入值是否合法,是否

   符合所要求的格式,这就是表单的输入验证。

  (1)需要验证的表单输入域的要求:

    ·用户名:用户名是否为空,是否符合规定的格式(用户名有字母开头,后跟字幕、数字或下划线!)。

    ·密码:密码长度是否超过6,两次密码输入是否一致。

    ·邮箱地址:邮箱地址必须符合邮箱的格式。

  (2)提交表单并实现输入验证的方式:

    一般用buttom类型,“提交”时先执行“响应函数”

    提交格式:

  <input type="buttom" value="提交" onClick=“响应函数”>

  另外,再验证函数中,当都满足格式后,在用以下格式,实现提交;、

      document.forms[0].submit();

function validata(){
var name=document.forms[0].userNmae.value;
var pwd=document.forms[0].userPwd.value;
var pwd1=document.forms[0].userPwd1.value;
var email=document.forms[0].userEmail.value;
var accept=document.forms[0].accept.checked;
var reg1=/[a-zA=Z]\w*/;
var reg2=/\w+([-+.']\w+)*@\w+([-.]\w+)*.\w+([-.]\w+)*/;
if(name.length<=0)alert("用户名不能为空!!");
else if(!reg1.test(name))alert("用户名格式不正确!!");
else if(pwd.length<6)alert("密码长度必须大于等于6! ");
else if(“pwd!=pwd1”)alert(“两次密码不一样!”);
else if(“!reg2.test(email))alert("邮件格式不正确”);
else if(“accept==false”)alert(“您需要仔细阅读并同意接受有用户使用协议”);
else document.forms[0].submit();
}

然后再页面的<head> </head>之间,添加一行:

<script language=“javascript” src=“ch02_10_JavaScript.js”></script>;

最后,修改注册页面以及最后的“提交输入域”:

<input type="Buttom" value="提交" onClick="validata()"/>;

2017.9.23 HTML学习总结----JavaScript实现输入验证的更多相关文章

  1. 2017.9.22 HTML学习总结--JavaScript脚本语言

    接上: 1.JavaScript脚本语言 定义:javascript是一种简单的脚本语言,可以在浏览器中直接运行, 是一种在浏览器端实现网页与客户交互的技术javascript代码可 以直接运行在ht ...

  2. JavaScript实现输入验证(简单的用户注册)

    1.先写用户注册页面userrAdd.jsp <body> <center> <form name="f1" id="f1" ac ...

  3. Javascript学习1 - Javascript中的类型对象

    原文:Javascript学习1 - Javascript中的类型对象 1.1关于Numbers对象. 常用的方法:number.toString() 不用具体介绍,把数字转换为字符串,相应的还有一个 ...

  4. HTML 学习笔记 JavaScript(面向对象)

    现在让我们继续跟着大神的脚步前进 学习一下JavaScript中的面向对象的思想,其实作为一个iOS开发者,对面向对象还是比较熟悉的,但是昨晚看了一下Js中的面向对象,妈蛋 一脸萌比啊.还好有大神.让 ...

  5. JavaScript学习13 JavaScript中的继承

    JavaScript学习13 JavaScript中的继承 继承第一种方式:对象冒充 <script type="text/javascript"> //继承第一种方式 ...

  6. 前端之JavaScript第一天学习(1)-JavaScript 简介

    javaScript 是世界上最流行的编程语言. 这门语言可用于 HTML 和 web,更可广泛用于服务器.PC.笔记本电脑.平板电脑和智能手机等设备. JavaScript 是脚本语言 JavaSc ...

  7. Javascript学习2 - Javascript中的表达式和运算符

    原文:Javascript学习2 - Javascript中的表达式和运算符 Javascript中的运算符与C/C++中的运算符相似,但有几处不同的地方,相对于C/C++,也增加了几个不同的运算符, ...

  8. 学习现代 JavaScript 编程的最佳教程

    天天编码 , 版权所有丨本文标题:0.0 学习现代 JavaScript 编程的最佳教程 转载请保留页面地址:http://www.tiantianbianma.com/the-modern-java ...

  9. 23 DesignPatterns学习笔记:C++语言实现 --- 2.7 Proxy

    23 DesignPatterns学习笔记:C++语言实现 --- 2.7 Proxy 2016-07-18 (www.cnblogs.com/icmzn) 模式理解

随机推荐

  1. FCN用卷积层代替FC层原因(转)

    分类任务 CNN对于常见的分类任务,基本是一个鲁棒且有效的方法.例如,做物体分类的话,入门级别的做法就是利用caffe提供的alexnet的模型,然后把输出的全连接层稍稍修改称为自己想要的类别数,然后 ...

  2. 创建本地Git并提交到码云

    概述 安装Git,使用Git Bash创建本地Git全局用户名,提交远程代码时将以此用户名显示git config --global --replace-all user.email "it ...

  3. java——变量

    1.静态变量: 随着类的加载而生成并初始化 随着类的消失而消失 2.成员变量: 随对象的加载而生成并初始化 随对象被回收而消失 3.局部变量: 作用范围由{}决定 随方法调用而创建 随方法的执行完毕而 ...

  4. vue首次赋值不触发watch(deep immediate handler)

    deep:默认值是 false,代表是否深度监听.immediate:true代表如果在 wacth 里声明了之后,就会立即先去执行里面的handler方法,如果为 false就跟我们以前的效果一样, ...

  5. SpringMVC---彻底解决/和/*的问题!到底该用哪一个?

    出处: https://blog.csdn.net/sinat_33921105/article/details/81951156 在web开发中我们经常会遇到/和/*的问题,有的时候稍不注意就容易忘 ...

  6. Robot Framework 的安装和配置

    Robot Framework 的安装和配置 在使用 RF(Rebot framework)的时候需要 Python 或 Jython 环境,具体可根据自己的需求来确定.本文以在有 Python 的环 ...

  7. DRF之权限认证频率组建

    认证组件 很久很久以前,Web站点只是作为浏览服务器资源(数据)和其他资源的工具,甚少有什么用户交互之类的烦人的事情需要处理,所以,Web站点的开发这根本不关心什么人在什么时候访问了什么资源,不需要记 ...

  8. SimpleAdapter与listview,gridview的组合用法

    首先要明白SimpleAdapter构造方法的几个参数的含义: public SimpleAdapter(Context context, List<? extends Map<Strin ...

  9. Day6上 括号匹配专项

    滑稽的题 T1 #include<iostream> #include<cstring> #include<queue> #include<algorithm ...

  10. AngularJS 指令解析(一)

    AngularJS 指令解析(一) 前言 笔者AngularJS接触时间差不多是两年多,虽然这两年多AngularJS版本日新月异,但是笔者的版本是比较老的1.4.3,一方面是自己对这个版本比较熟悉, ...