一、表单验证的必要性:

  表单验证在客户端和服务器端,客户端验证实际是直接调用JavaScript脚本对用户输入的数据进行验证;而服务器也同样可以实现数据验证,但是当服务器压力过大时,资源损耗会比较严重,用户体验也不够好。所以通常验证我们大多数都会在客户端实现,这样可以降低服务器的压力,让服务器做其他更重要的事情。

二、表单验证的内容:

  1、验证表单内容是否为空。

  2、验证是否为数字。

  3、验证电子邮件格式。

  4、验证数据是否在某个范围以内。

  5、验证用户输入的内容长度是否足够。

  以上是表单验证中常见的验证规则,还有一些其他规则,需要我们根据实际需要自己编写验证规则。

三、表单元素常用属性、方法和事件:

  属性:

  id:返回文本框的id

  value:返回文本框的值

  方法: 

  blur():从文本框中移开焦点

  focus():让文本框获取焦点

  select():选择文本框内容

  事件:

  onblur():失去焦点时触发

  onfocus():获取焦点时触发

  onkeypress():按下键盘并松开

  通过以上的事件和方法可以设置表单元素验证的时机,比如当失去焦点或者按下键盘内容就直接验证,这样用户体验更好,不需要用户点击提交按钮才实现验证。

  

  

Java Script基础(十一) 表单验证的更多相关文章

  1. es6 封装一个基础的表单验证

    1, 需求分析 设计一个通用的表单验证,如果后期表单中添加了更多的需求,不需要更改之前的代码逻辑,最好不要改之前的代码,需要加什么直接加就好了. 2,代码分析 此表单验证最好返回一个函数,在api设计 ...

  2. jQuery基础之表单验证

    在使用jquery-validate.js插件时可以做一些初始化配置在初始化jquery-validate.js对象的时候,将外部的一些配置和该插件内部的一些默认配置合并在一起,如果有相同的配置,前者 ...

  3. 网络安全从入门到精通 (第二章-6) 后端基础PHP—表单验证

    本文内容: 什么是表单? 如何创建一个表单: 接收并验证: PHP和数据库交互 1,什么事表单? 表单在网页中主要负责数据采集. 表单由三部分组成: 表单标签:这里面包含了处理表单数据所用动态脚本的U ...

  4. java工具类(二)之java正则表达式表单验证

    java正则表达式表单验证类工具类(验证邮箱.手机号码.qq号码等) 这篇文章主要介绍了java使用正则表达式进行表单验证工具类,可以验证邮箱.手机号码.qq号码等方法,需要的朋友可以参考下. jav ...

  5. python_way day17 jQuery表单验证,事件绑定,插件,文本框架,正则表达式

    python_way day17 1.jQuery表单验证 dom事件绑定 jquery事件绑定 $.each return值的判断 jquery扩展方法 2.前段插件 3.jDango文本框架 4. ...

  6. FormValidator表单验证

    所需的库文件 红色框内是所需要的JavaScript库文件. <%@ page language="java" contentType="text/html; ch ...

  7. jquery validate表单验证插件-推荐

    1 表单验证的准备工作 在开启长篇大论之前,首先将表单验证的效果展示给大家.     1.点击表单项,显示帮助提示 2.鼠标离开表单项时,开始校验元素  3.鼠标离开后的正确.错误提示及鼠标移入时的帮 ...

  8. jquery validate表单验证插件

    1 表单验证的准备工作 在开启长篇大论之前,首先将表单验证的效果展示给大家.     1.点击表单项,显示帮助提示 2.鼠标离开表单项时,开始校验元素  3.鼠标离开后的正确.错误提示及鼠标移入时的帮 ...

  9. Laravel教程 七:表单验证 Validation

    Laravel教程 七:表单验证 Validation 此文章为原创文章,未经同意,禁止转载. Laravel Form 终于要更新这个Laravel系列教程的第七篇了,期间去写了一点其他的东西. 就 ...

  10. html5 表单样式 表单验证1 2 3

    html5 表单样式 ie9以下不支持 <!DOCTYPE html> <html lang="en"> <head> <meta cha ...

随机推荐

  1. [转]前景检测算法--ViBe算法

    原文:http://blog.csdn.net/zouxy09/article/details/9622285 转自:http://blog.csdn.net/app_12062011/article ...

  2. iOS的几种定时器

    //gcd的定时器timer必须先保存为一个属性或者成员变量 @property (nonatomic , assign) dispatch_source_t timer; //第一种 每一秒执行一次 ...

  3. 结构类模式(七):代理(Proxy)

    定义 为其他对象提供一种代理以控制对这个对象的访问. 代理模式也叫做委托模式,它是一项基本设计技巧.许多其他的模式,如状态模式.策略模式.访问者模式本质上是在更特殊的场合采用了委托模式,而且在日常的应 ...

  4. C语言的struct/union字节对齐

    C语言的一大优势就是对内存空间的控制,当然,一般情况下对于开发人员来说都是透明的.看一个始终困扰初学者的问题:字节对齐! 先看四个重要的基本概念:1.数据类型自身的对齐值:对于char型数据,其自身对 ...

  5. SQLServer2005 提示 '其他会话正在使用事务的上下文'

    MSDN上看了一下说是sql server 2005不支持在分布式事务处理中存在指向本地的链接服务器(环回链接服务器) 这个是官方的回答 个人认为,应该是在事务中,使用了链接服务器访问进行跨库访问引起 ...

  6. VTK序列图像的读取[转][改]

    医学图像处理的应用程序中,经常会碰到读取一个序列图像的操作.比如CT.MR等所成的图像都是一个切面一个切面地存储的,医学图像处理程序要处理这些数据,第一步当然是把这些数据从磁盘等外部存储介质中导入内存 ...

  7. PHPCMS教程

    第一章 模版 参见:http://blog.163.com/zh_astro/blog/static/1842084562011430430419/ 碎片管理: 在模版页面需要添加碎片的位置加上代码{ ...

  8. Codeforces Beta Round #12 (Div 2 Only) D. Ball sort/map

    D. Ball Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/problemset/problem/12/D D ...

  9. ListView的自动循环滚动显示

    最近项目里需要做评价内容的循环滚动显示,一开始想到的就是定时器.后来查了资料才知道ListView里面有个函数smoothScrollToPosition(position),瞬间觉得简单了很多.首先 ...

  10. 如何在 iOS 8 中使用 Swift 实现本地通知(上)

    当你的应用在后台运行时,可以简单地使用本地通知把信息呈现给用户.它可以允许你显示 提醒.播放提示音和数字角标(badge).本地通知可以被以下的事件触发:计划好的时间点或者用户进入和离开某个地理区域. ...