jQuery--表单校验

article/2025/10/1 3:16:31

jQuery -- 表单校验

  • 表单验证
    • String对象和表单验证有关的成员
    • 正则表达式
    • 表单选择器
    • 表单验证事件和方法

表单验证

为什么要进行表单验证? 无论是动态网站,还是其他B/S结构的系统,都离不开表单。 表单作为客户端向服务器端提交数据的主要载体,表单验证是避免提交的数据不合法的重要途径。
减轻服务器的压力
保证输入的数据符合要求

String对象和表单验证有关的成员

方法名方法介绍
indeof()检索一个字符串中是否含有指定内容内容返回值为索引,可以指定开始查找位置
substring()可以用来截取字符串;和slice参数一样,包开始不包结束;不同的是这个方法不能接受负值为参数,如果传递了一个负值,则默认使用为0,而且他还自动调整参数位置,如果第二个参数小于第一个,则自动交换
test()方法用于检测一个字符串是否匹配某个模式

正则表达式

代码功能
^匹配字符串开头
$匹配字符串结尾
[A-Z][A-Z] 表示一个区间,匹配所有大写字母,[a-z] 表示所有小写字母。
[\s\S]匹配所有。\s 是匹配所有空白符,包括换行,\S 非空白符,不包括换行。
\w匹配字母、数字、下划线。等价于 [A-Za-z0-9_]
.表示任意字符串
[\d\D]\d任意数字。\D除了数字

表单选择器

语法描述
:input匹配所有input、textarea、select和button 元素
:text匹配所有单行文本框
:password匹配所有密码框
:radio匹配所有单项按钮
:checkbox匹配所有复选框
:submit匹配所有提交按钮
:image匹配所有图像域
:reset匹配所有重置按钮
:button匹配所有按钮
:file匹配所有文件域
:hidden匹配所有不可见元素,或者type 为hidden的元素

属性过滤选择器

语法描述
:enabled匹配所有可用元素
:disabled匹配所有不可用元素
:checked匹配所有被选中元素(复选框、单项按钮、select 中的option)
:selected匹配所有选中的option 元素

表单验证事件和方法

事件

名称描述
onblur失去焦点,当光标离开某个文本框时触发
onfocus获得焦点,当光标进入某个文本框时触发

方法

名称描述
blur()从文本域中移开焦点
focus()在文本域中设置焦点,即获得鼠标光标
select()选取文本域中的内容,突出显示输入区域的内容

在这里插入图片描述


http://chatgpt.dhexx.cn/article/cddULYXL.shtml

相关文章

jQuery表单验证插件

表单验证插件 表单验证规则 <!DOCTYPE html> <html><head><meta charset"utf-8" /><title></title><style>#myform label.error{color: #FF0000;}</style><script src"js/jquery-3.3.1.js"><…

jQuery基础之表单验证

前言 在学习jquery-validate.js时的一些的记录 正文 在使用jquery-validate.js插件时可以做一些初始化配置 在初始化jquery-validate.js对象的时候&#xff0c;将外部的一些配置和该插件内部的一些默认配置合并在一起&#xff0c;如果有相同的配置&#xff0c;前者覆盖后者…

JQuery表单校验

JQuery表单验证 常用表单主要包括&#xff1a;用户名–密码–确认密码–邮箱–验证码 初学阶段我们忽略验证码的真实性&#xff0c;仅对齐进行非空验证 表单代码 <div id"content"><div class"login_form"><div class"login_box&quo…

jQuery表单验证(Validate)使用方法

表单的校验是jQuery给页面开发者带来极大便利的功能之一&#xff0c;无论是在校大学生还是已经上班的工程师&#xff0c;都可以了解一下表单校验的基本功能。 目录 1.先来一张简单的表单2.引入需要用到的jQuery3.指定需要验证的内容4.如何自定义报错信息的位置5.如何添加其他的…

jQuery插件及表单验证

一、自定义插件 前提&#xff1a;引入jquery-3.3.1.js <script src"js/jquery-3.3.1.js" type"text/javascript"></script> 1、$.extend(对象1&#xff0c;对象2) 对象1继承对象2 /*自定义插件*/$(function(){//$extend(对象1,对象2) 对象1…

jq表单验证

<!DOCTYPE html> <html><head><title>手工实现表单验证</title><meta charset"utf-8" /><script src"scripts/jquery-1.11.3.js"></script></head><body><fieldset><legend>用户…

用jQuery实现表单验证

转载自&#xff1a;https://www.cnblogs.com/hellowzl/p/5612122.html ——选自《锋利的jQuery》&#xff08;第2版&#xff09;第5章的例题 5.1.5 表单验证 表单&#xff08;form&#xff09;作为 HTML 最重要的一个组成部分&#xff0c;几乎在每个网页上都有体现&#xff0…

jQuery-表单验证使用方法

目录 一、表单验证单词二、思维导图三、表单验证的使用方法四、复选框全选和取消全选 一、表单验证单词 二、思维导图 三、表单验证的使用方法 代码如下&#xff1a; <!DOCTYPE html> <html><head><meta charset"utf-8"><title><…

jQuery-表单校验

为什么要表单验证 1.减轻服务器的压力 2.保证输入的数据符合要求 常用的表单验证 日期格式表单元素是否为空用户名和密码E-mail地址身份证号码 表单选择器 语法 描述 示例 :input 匹配所有input、textarea、select和button 元素 $("#myform :input")选取…

jQuery实现表单验证

1.基于html表单&#xff0c;利用jQuery实现表单验证功能。 2.html基本结构和样式&#xff1a; 3.html代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <h…

JQuery-表单验证

1.什么是表单验证&#xff1f; 表单验证是javascript中的高级选项之一。 可用来在数据被送往服务器前对 HTML 表单中的这些输入数据进行验证。 2.为什么表单验证&#xff1f; 减轻服务器的压力 。 保证输入的数据符合要求。 3.案例 实现表单验证的案例在这里用GiWiFI页面…

SurfaceTexture

SurfaceTexture 类是在 Android 3.0 中引入的。就像 SurfaceView 是 Surface 和 View 的结合一样&#xff0c;SurfaceTexture 是 Surface 和 GLES texture 的粗糙结合&#xff08;有几个警告&#xff09;。 当你创建了一个 SurfaceTexture&#xff0c;你就创建了你的应用作为消…

UserWarning: findfont: Font family [‘sans-serif‘] not found. Falling back to DejaVu Sans

Python数据可视化分析时出现UserWarning: findfont: Font family [‘sans-serif’] not found. Falling back to DejaVu Sans…报错 原因&#xff1a;库中没有关于’Microsoft YaHei’的引用 换一种字体记一下 如 字体中文名称字体英文名称黑体SimHei宋体SimSun新宋体NSimSum…

The tag <fonta> is unrecognized in this browser. If you meant to render a React component, start its

写react 组件样式 styled-components 报错 是因为react 千万记住开头字母是大写 由于这个f小写了 但是这个是当成了一个组件在用 所以会一直报错 改为大写就会解决了 小伙伴们千万注意 react的项目组建开头必须大写

createfont(CreateFontIndirectW)

如何用CreateFont创建制定点大小的字符 import java.awt.Font; import java.io.File; import java.io.FileInputStream; public class Loadfont public static Font loadFont(String fontFileName, float fontSize) //第一个参数是外部字体名&#xff0c;第二个是字体大小 File…

MindFusion.WinForms Pack 2022.R2

MindFusion.WinForms Pack 2022.R2 每个节点多个标签-允许为单个流程图节点显示多个标题。您可以自定义节点标签&#xff0c;包括显示和定位。 混杂的 bhMoveLabels行为现在允许用户交互移动链接和节点标签。 水平偏移和垂直偏移现在适用于使用SetLinkLengthPosition方法定位的…

findfont: Font family [‘Times New Roman‘] not found. Falling back to DejaVu Sans.字体安装

问题描述 使用python对数据进行可视化的时候&#xff0c;matplotlib绘图的时候&#xff0c;提示警告如题所示&#xff1a; UserWarning: findfont: Font family [Times New Roman] not found. Falling back to DejaVu Sans. 环境说明&#xff1a;使用的是 CentOS系统&#xf…

Could not load file or assembly ‘office, Version=12.0.0.0, Culture=neutral, PublicKeyToken=71e9bce11

Could not load file or assembly office, Version12.0.0.0, Cultureneutral, PublicKeyToken71e9bce11 window10 Could not load file or assembly office, Version12.0.0.0, Cultureneutral, PublicKeyToken71e9bce11 新的改变 我们对Markdown编辑器进行了一些功能拓展与语…

jasperreports6.12.2 could not load the following font解决方法

jasperreports通过Java代码生成PDF的时候不能获取中文字体&#xff0c;报错提示如下&#xff1a; net.sf.jasperreports.engine.JRRuntimeException: Could not load the following font: pdfFontName: STSong-Light pdfEncoding: Identity-H isPdfEmbedded : true本次环境&…

快速小巧的粘贴应用程序Hasty Paste

什么是 Hasty Paste? Hasty Paste 是一个快速粘贴文本并共享的地方&#xff0c;主要用于共享调试日志等&#xff0c;以帮助开发人员提供技术支持。该项目的目标是既快又小。 命令行安装 在群晖上以 Docker 方式安装。 官方的镜像没有发布在 docker hub&#xff0c;而是在 gh…