当前位置：首页 > news >正文

南宁建筑网站江苏省住房和城乡建设厅

news 2025/10/22 14:51:43

南宁建筑网站,江苏省住房和城乡建设厅,淘宝网页设计模板素材,中国建设银行官网站代发工资文章目录简介：什么是正则表达式以及作用：●文本框内容的验证：代码演示示例： 简介： jQuery Form插件是一个优秀的Ajax表单插件，可以非常容易地、无侵入地升级HTML表单以支持Ajax。jQuery Form有两个核心方法…

文章目录

简介：
什么是正则表达式以及作用：
●文本框内容的验证：
代码演示示例：

简介：

jQuery Form插件是一个优秀的Ajax表单插件，可以非常容易地、无侵入地升级HTML表单以支持Ajax。jQuery
Form有两个核心方法 – ajaxForm() 和 ajaxSubmit()，
它们集合了从控制表单元素到决定如何管理提交进程的功能。另外，插件还包括其他的一些方法：
formToArray()、formSerialize()、fieldSerialize()、fieldValue()、clearForm()、clearFields()
和 resetForm()等。

什么是正则表达式以及作用：

正则表达式，又称规则表达式,（Regular
Expression，在代码中常简写为regex、regexp或RE），是一种文本模式，包括普通字符（例如，a 到 z
之间的字母）和特殊字符（称为"元字符"），是计算机科学的一个概念。

正则表达式中的括号()主要有两个作用：分组和捕获。

分组：在正则表达式中，括号可以用来将一些字符组合在一起，形成一个分组。这通常用于确定优先级、重复次数或特殊的匹配规则。例如，(ab)可以将字符a和b组合在一起作为一个整体进行匹配。
捕获：当正则表达式中的括号内匹配到特定的文本时，可以将这些文本保存下来，以便后续使用。捕获的内容可以用于替换操作或者在其他正则表达式中进行引用。例如，在替换操作中，可以使用\1来引用第一个捕获的内容。

●文本框内容的验证：

1、实现思路

2、使用 String 对象的 length 属性验证密码的长度

3、验证两次输入密码是否一致

4、使用 length 属性获取文本长度，然后使用 for 循环和 substring ( ) 方法依次截断单个字符，最后判断每个字符是否是数字



标签	描述
form	定义供用户输入的表单
input	定义输入域
textarea	定义文本域 (一个多行的输入控件)
label	定义了 input 元素的标签，一般为输入标题
fieldset	定义了一组相关的表单元素，并使用外框包含起来
legend	定义了 fieldset 元素的标题
select	定义了下拉选项列表
optgroup	定义选项组
option	定义下拉列表中的选项
button	定义一个点击按钮

代码演示示例：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<style>.over { font-size: large; font-style: italic; }.out { font-size: small; }
</style>
<body><div id="display">demo</div>
<div id="test"></div>
<br><br>
<form id="theForm">输入字符<div><input type="text" id="username" onblur="isString(this.value)"></div>输入正确的数字<div><input type="text" id="password" onblur="isInteger(this.value)"></div>输入正确的电话<div><input type="text" id="telephone" onblur="isTelephone(this.value)"></div>确移动电话<div><input type="text" id="mobile" onblur="isMobile(this.value)"></div>邮箱地址<div><input type="text" id="email" onblur="isEmail(this.value)"></div>inernet地址<div><input type="text" id="uri" onblur="isUri(this.value)"></div><div><input type="button" value="Validata" onclick="return validata();"></div></form>
<script src="../jQuery/jquery-1.12.4.js"></script>
<script>function validata() {if ($("#username").val() == "") {alert("请输入名字");return false;}if ($("#password").val() == "") {alert("请输入密码");return false;}if ($("#telephone").val() == "") {alert("请输入电话号码");}if ($("#email").val() == "") {$("#email").val("shuangping@163.com");}}function isInteger(obj) {reg = /^[-+]?\d+$/;if (!reg.test(obj)) {$("#test").html("<b>Please input correct figures</b>");} else {$("#test").html("");}}function isEmail(obj) {reg = /^\w{3,}@\w+(\.\w+)+$/;if (!reg.test(obj)) {$("#test").html("<b>请输入正确的邮箱地址</b>");} else {$("#test").html("");}}function isString(obj) {reg = /^[a-z,A-Z]+$/;if (!reg.test(obj)) {$("#test").html("<b>只能输入字符</b>");} else {$("#test").html("");}}function isTelephone(obj) {reg = /^(\d{3,4}\-)?[1-9]\d{6,7}$/;if (!reg.test(obj)) {$("#test").html("<b>请输入正确的电话号码！</b>");} else {$("#test").html("");}}function isMobile(obj) {reg = /^(\+\d{2,3}\-)?\d{11}$/;if (!reg.test(obj)) {$("#test").html("请输入正确移动电话");} else {$("#test").html("");}}function isUri(obj) {reg = /^http:\/\/[a-zA-Z0-9]+\.[a-zA-Z0-9]+[\/=\?%\-&_~`@[\]\':+!]*([^<>\"\"])*$/;if (!reg.test(obj)) {$("#test").html($("#uri").val() + "请输入正确的inernet地址");} else {$("#test").html("");}}//document加载完毕执行$(document).ready(function() {// do something here//隔行换色功能$("p").each(function(i) {this.style.color = ['red', 'green', 'blue', 'black'][i % 2]});//eq(2)获取$("p")集合的第3个元素$("p").eq(2).click(function() {$("#display").css("color", "blue")});//所有test中的p都附加了样式"over"。$("#test>p").addClass("over");//test中的最后一个p附加了样式"out"。$("#test p:last").addClass("out");//选择同级元素还没看懂//$('#faq').find('dd').hide().end().find('dt').click(function()//选择父级元素$("a").hover(function() {$(this).parents("p").addClass("out")},function() {$(this).parents("p").removeClass("out")})//hover鼠标悬停效果，toggle每次点击时切换要调用的函数 ,//trigger(eventtype): 在每一个匹配的元素上触发某类事件,//bind(eventtype,fn)，unbind(eventtype): 事件的绑定与反绑定从每一个匹配的元素中（添加）删除绑定的事件。//方法的连写$("#display").hover(function() {$(this).addClass("over");},function() {$(this).removeClass("over");}).click(function() {alert($("#display").text())});});</script>
</body>
</html>