表单验证(JS)

本文涉及的产品
性能测试 PTS,5000VUM额度
注册配置 MSE Nacos/ZooKeeper,118元/月
可观测可视化 Grafana 版,10个用户账号 1个月
简介: 目的:减轻服务器压力;用来传数据给服务器的时候进行验证吗,减轻负担。正则表达式使用单个字符串来描述,匹配符合某一个规则额字符串搜索模式。我们可以用正则表达式测试字符串内的模式、替换文本、从字符串中提取字符串等。//字面量方式:包含斜杠之间的模式 var r = / 正则 /;//构造函数方式,调用RegExp对象构造函数 var r = new RegExp("正则");//判断 var flag = r('内容');上一章:JS与CSS的交互下一章:jQuery(入门~选择器)

一、JS表单基本介绍

1、概述 作用

目的:减轻服务器压力;用来传数据给服务器的时候进行验证吗,减轻负担。

2、分析

需求:

  1. 不能为空
  2. 字符长度
  3. 正则
  4. 密码是否一直
  5. 焦点验证 等等等等

3、思路

输入表单数据的时候,可以用很多方式提示,比如:

  1. 表单元素
  2. JS的以下方法
  3. 触发onsubmit事件,对获取的数据验证 等等。

二、JS事件列表

在网页中我们有很多 的方法激活元素。比如:鼠标左右键,单双击,失去焦点等等。

方式一:用属性    
如:onclick
方式二:匿名函数
元素名.onclick=function(){
   }

事件名:
onclick:单击事件
ondblclick :双击事件
onload:加载完毕
onfocus :得到焦点
onblur :失去焦点
onchange : 改变事件
onmouseover : 鼠标移上
onmouseout :鼠标移出
onsubmit : 表单提交事件

三、表单验证方式

1、tring 常见方法

indexOf(), lastIndexOf() 查找字符位置
charAt()按索引返回字符串
concat() 拼接字符串
substr()按长度截取字符串
slice()截取字符串
substring() 截取字符串
replace() 替换字符串
toUpperCase(),toLowerCase() 大小写转换

四、正则表达式

1、概述

正则表达式使用单个字符串来描述,匹配符合某一个规则额字符串搜索模式。
我们可以用正则表达式测试字符串内的模式、替换文本、从字符串中提取字符串等。

2、定义

//字面量方式:包含斜杠之间的模式
var r=/正则/;
//构造函数方式,调用RegExp对象构造函数
var r=new RegExp("正则");
//判断
var flag=r('内容');

上一章:JS与CSS的交互
下一章:jQuery(入门~选择器)

相关文章
|
6月前
|
JavaScript 前端开发
JavaScript事件监听、常见事件及表单验证
JavaScript事件监听、常见事件及表单验证
60 0
|
2月前
|
JavaScript 前端开发
JavaScript 表单验证
JavaScript 表单验证
20 9
|
2月前
|
JavaScript 前端开发
js登录注册简单tab切换页面(含前台表单验证)
文章介绍了如何使用HTML、CSS和JavaScript创建一个简单的登录注册页面,并实现Tab切换效果。包括了表单验证,点击登录或注册按钮时,可以切换显示相应的表单。同时提供了完整的前端代码和实现效果图。
|
3月前
|
Java 开发者 关系型数据库
JSF与AWS的神秘之旅:如何在云端部署JSF应用,让你的Web应用如虎添翼?
【8月更文挑战第31天】在云计算蓬勃发展的今天,AWS已成为企业级应用的首选平台。本文探讨了在AWS上部署JSF(JavaServer Faces)应用的方法,这是一种广泛使用的Java Web框架。通过了解并利用AWS的基础设施与服务,如EC2、RDS 和 S3,开发者能够高效地部署和管理JSF应用。文章还提供了具体的部署步骤示例,并讨论了使用AWS可能遇到的挑战及应对策略,帮助开发者更好地利用AWS的强大功能,提升Web应用开发效率。
61 0
|
4月前
|
移动开发 前端开发 JavaScript
|
6月前
|
前端开发 JavaScript UED
使用JavaScript实现表单验证
使用JavaScript实现表单验证
|
11月前
|
JavaScript 前端开发
原生JavaScript之dom添加表单验证
原生JavaScript之dom添加表单验证
56 2
原生JavaScript之dom添加表单验证
|
6月前
|
移动开发 JavaScript 前端开发
分享21个JS抽奖转盘特效,36个JS表单验证,31个JS进度条,总有一款适合您
分享21个JS抽奖转盘特效,36个JS表单验证,31个JS进度条,总有一款适合您
84 0
|
6月前
|
前端开发 JavaScript API
创建强大的网页表单验证器:使用JavaScript
创建强大的网页表单验证器:使用JavaScript
|
6月前
|
JavaScript 前端开发 安全
使用JavaScript实现动态表单验证(下)
使用JavaScript实现动态表单验证