JS 验证


**JavaScript 可用来在数据被送往服务器前对 HTML 表单中的这些输入数据进行验证。

**


JavaScript 表单验证

JavaScript 可用来在数据被送往服务器前对 HTML 表单中的这些输入数据进行验证。

被 JavaScript 验证的这些典型的表单数据有:

  • 用户是否已填写表单中的必填项目?
  • 用户输入的邮件地址是否合法?
  • 用户是否已输入合法的日期?
  • 用户是否在数据域 (numeric field) 中输入了文本?

必填(或必选)项目

下面的函数用来检查用户是否已填写表单中的必填(或必选)项目。假如必填或必选项为空,那么警告框会弹出,并且函数的返回值为 false,否则函数的返回值则为 true(意味着数据没有问题):

function validate_required(field,alerttxt)
{
with (field)
{
if (value==null||value=="")
{alert(alerttxt);return false}
else {return true}
}
}

下面是连同 HTML 表单的代码:

<html>
<head>
<script type="text/javascript"> function validate_required(field,alerttxt)
{
with (field)
{
if (value==null||value=="")
{alert(alerttxt);return false}
else {return true}
}
} function validate_form(thisform)
{
with (thisform)
{
if (validate_required(email,"Email must be filled out!")==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>

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 表单的完整代码:

<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>

JS 验证的更多相关文章

  1. JS验证图片格式和大小并预览

    用于上传图片的js验证: <%@ page language="java" contentType="text/html; charset=UTF-8"p ...

  2. 正则表达式的JS验证

    /判断输入内容是否为空    function IsNull(){        var str = document.getElementById('str').value.trim();      ...

  3. 【转】去除eclipse的JS验证

    第一步:去除eclipse的JS验证:将windows->preference->Java Script->Validator->Errors/Warnings->Ena ...

  4. js验证输入的金钱格式

    <html> <head> <title>js验证输入的金钱格式</title> <script type="text/javascri ...

  5. .NET中表单的JS验证

    JS验证代码如下:(需要引入两个JS包) <script type="text/javascript" src="/js/jquery.validate.min.j ...

  6. 九月二十八JS验证

    js表单验证 js可用发来在数据被送往服务器前对HTML表单中的这些输入数据进行验证 被js验证的这些典型的表单数据有: >用户是否已填写表单中的必填项目: >用户输入的邮件地址是否是合法 ...

  7. js验证姓名和身份证号

    js验证真实姓名,是用的unicode字符的来进行匹配,而中国人的姓名长度一般都是2-4,所以重复匹配{2,4}次 1.js验证真实姓名 1 var regName =/^[\u4e00-\u9fa5 ...

  8. SpringMVC学习系列-后记 结合SpringMVC和Hibernate-validator,根据后台验证规则自动生成前台的js验证代码

    在SpringMVC学习系列(6) 之 数据验证中我们已经学习了如何结合Hibernate-validator进行后台的数据合法性验证,但是通常来说后台验证只是第二道保险,为了更好的用户体验会现在前端 ...

  9. 让 ASP.NET JS验证和服务端的 双验证 更简单

    只用JavaScript验证安全不安全谁都知道,答案是不安全,非常的不安全.因为在客户端进行的验证相当于“让用户自己验证自己”,很明显是不靠谱的.你不能避免一些恶意用户人为的修改自己的表单进行欺骗,也 ...

  10. js验证电话号码的正则表达式

    在做程序时遇到js验证电话号码的问题,使用正则表达式来操作很简单的.一起来看一下吧. 1,这种是比较简单的验证号码: 电话号码只能包含”(“.“)”.“-”和数字 <input   type=t ...

随机推荐

  1. oracle数据库执行sql文件

    使用oracle客户端连接数据库,从oracle官网下载客户端instantclient_18_3工具,到目录下打开cmd命令窗口: 个人网盘客户端工具:https://pan.baidu.com/s ...

  2. SQL数据库基础

    SQL:Structured Quety Language SQL SERVER是一个以客户/服务器(c/s)模式访问.使用Transact-SQL语言的关系型数据库管理子系统(RDBMS) DBMS ...

  3. 视频分享慕课网----Angular 打造企业级协作平台

    慕课网是一个非常不错的视频学习网站,搭建搭建企业协作平台,导师由深到浅,讲解的特别好. 本课程主要学习 Angular 进阶知识点和技巧(Material.动画.依赖注入.表单控件.RxJS,Redu ...

  4. Jmeter性能测试分布式技术

    一.什么是分布式测试 分布式测试是指通过局域网和Internet,把分布于不同地点.独立完成特定功能的测试计算机连接起来,以达到测试资源共享.分散操作.集中管理.协同工作.负载均衡.测试过程监控等目的 ...

  5. C# -- 使用ODBC连接数据库

    C# -- 使用ODBC连接数据库 public class ODBCHelper { public static string conString1 = "Dsn=sqlServerDsn ...

  6. 爬虫(四):requests模块

    1. requests模块 1.1 requests简介 requests 是一个功能强大.简单易用的 HTTP 请求库,比起之前用到的urllib模块,requests模块的api更加便捷.(本质就 ...

  7. Python-xlwt库的基本使用

    安装xlwt库 pip install xlwt 基本使用 ①创建工作簿 wa = xlwt.Workbook() ②添加工作表 添加“class”工作表 b = wa.add_sheet('clas ...

  8. 设计模式之观察者模式C#实现

    说明:主要参考<Head First设计模式(中文版)>,使用C#代码实现. 代码:Github 1.观察者模式UML图 2.气象监测类图 3.气象监测代码(书中C#版) 3.1 Obse ...

  9. 一文读懂AOE到底是什么!

    一.背景 1.1 AoE是什么 AoE (AI on Edge) 是一个滴滴开源的终端侧AI集成运行时环境(IRE).以 “稳定性.易用性.安全性” 为设计原则,帮助开发者将不同框架的深度学习算法轻松 ...

  10. Pyhton中变量和数据类型

    一.变量 Python中变量的命名规则: 1.变量名只能包含数字.字母.下划线,且不能用数字打头. eg: message_1是对的但1_message就是错误的 2.变量名不能包含空格. 3.在变量 ...