<link type="text/css" rel="stylesheet" href="/eitp/styles/successOrFailure.css"/>
<script type="text/javascript" src="<s:url value='/scripts/jquery/jquery.validate.js' />"></script>
<script type="text/javascript" src="/eitp/scripts/jquery/jquery-ui-1.7.custom.min.js"></script>
<script type="text/javascript"/>
$(document).ready(function(){
//验证
if($("#messageBox").length>0){
$("#messageBox").hide();
}
$.validator.setDefaults({
submitHandler: function(form) {
form.submit();
}
});
$("#teacherForm").validate({
errorLabelContainer: "#messageBox",
debug:true,
wrapper: "li",
rules:{
"teacherInfo.name":{required:true,byteRangeLength:[4,30]},
"teacherInfo.birth":{required:true,dateISO:true},
"teacherInfo.familyPhone":{isPhone:true},
"teacherInfo.phone":{isMobile:true},
"teacherInfo.zipCode":{isZipCode:true},
"teacherInfo.familyAddr":{byteRangeLength:[2,200]},
"teacherInfo.emailAddr":{email:true},
"teacherInfo.personalMotto":{byteRangeLength:[1,200]}
},
messages:{
"teacherInfo.name":{required:'<s:text name="basicInfo.item.validatorName"/>',byteRangeLength:'<s:text name="index.item.validatorName"/>'},
"teacherInfo.birth":{required:'<s:text name="basicInfo.item.validatorBirth"/>',dateISO:'<s:text name="basicInfo.item.validatorBirthDate"/>'},
"teacherInfo.familyPhone":{isPhone:'<s:text name="basicInfo.item.validatorFamilyPhone"/>'},
"teacherInfo.phone":{isMobile:'<s:text name="basicInfo.item.validatorMobile"/>'},
"teacherInfo.zipCode":{isZipCode:'<s:text name="basicInfo.item.validatorZipCode"/>'},
"teacherInfo.familyAddr":{byteRangeLength:'<s:text name="basicInfo.item.validatorFamilyAddress"/>'},
"teacherInfo.emailAddr":{email:'<s:text name="basicInfo.item.validatorEmail"/>'},
"teacherInfo.personalMotto":{byteRangeLength:'<s:text name="basicInfo.item.validatorPersonalMotto"/>'}
}
});
//长度验证
$.validator.addMethod("byteRangeLength", function(value, element, param) {
var length = value.length;
for(var i = 0; i < value.length; i++){
if(value.charCodeAt(i) > 127){
length++;
}
}
return this.optional(element) || ( length >= param[0] && length <= param[1] );
});
// 电话号码验证
$.validator.addMethod("isPhone", function(value, element) {
var tel = /^(\d{3,4}-?)?\d{7,9}$/g;
return this.optional(element) || (tel.test(value));
});
//手机号码验证
$.validator.addMethod("isMobile", function(value, element){
var length = value.length;
return this.optional(element) || length == 11 && /^1[358]\d{9}$/.test(value);
});
// 邮政编码验证
$.validator.addMethod("isZipCode", function(value, element) {
var tel = /^[0-9]{6}$/;
return this.optional(element) || (tel.test(value));
});
//设置头像
$("#teacherPhoto").dialog({
autoOpen:false,
width:400,
height:400,
resizable: false,
title:'<fmt:message key="student.item.chooseReallyPhoto"/>'
});
});
</script>
--------------------------------------------------------------------------
分享到:
相关推荐
《jQuery表单检验插件ez validator v1.1 for PHPCMS2008详解》 在Web开发中,表单验证是不可或缺的一环,它能够确保用户输入的数据符合预设的规则,防止无效数据的提交,提升用户体验,降低服务器处理压力。PHPCMS...
jquery的基础知识运用, jquery表单验证实例,深入了解
jQuery表单验证插件** jQuery有许多优秀的表单验证插件,例如jQuery Validation Plugin。这个插件提供了丰富的验证规则和自定义错误消息功能。通过简单的配置,可以实现各种复杂的验证需求。 **4. 验证规则** - **...
"jQuery表单验证(各表单后面提示)"这个主题主要涵盖了如何利用jQuery实现对用户输入的实时验证,并在错误发生时提供直观的提示信息。 一、jQuery基础 在深入表单验证之前,我们需要了解jQuery的基本用法。jQuery...
总结来说,jQuery在创建一个完整的注册表单验证系统中发挥着重要作用,它提供了便捷的DOM操作和事件处理机制,帮助开发者轻松地实现前端验证,提升用户体验。结合适当的后端交互,我们可以构建出一个安全、友好的...
在【标题】"带完成百分比的jQuery表单插件"中,提到的完成百分比功能是指一种能够实时显示表单填写进度的技术。这种插件通常会计算用户在表单中已填写的字段数量或必填字段的完成情况,并将其转换为百分比,以视觉...
1. **事件绑定**:jQuery通过`$(selector).on('event', function() {...})`绑定事件,如`submit`事件用于监听表单提交,`change`事件则检测输入框内容变化。 2. **验证函数**:在事件处理函数中,我们可以编写验证...
10. **JavaScript逻辑**:js文件夹中的脚本文件包含了表单验证的核心逻辑,通过jQuery方法监听表单事件,执行验证函数,并根据验证结果动态更新错误提示。 这款验证代码是移动应用开发中的一个实用组件,通过合理...
**JavaScript事件**在表单验证中扮演关键角色,如`input`事件可以实时检测用户输入,`blur`事件在用户离开输入框时触发验证。我们可以通过jQuery的`$(selector).on('event', function() {...})`结构绑定这些事件。 ...
3. JavaScript文件:主要使用jQuery编写,监听用户的输入事件,如`keyup`或`input`,当检测到输入内容变化时,计算新的输入框长度,并使用CSS的`style`属性或`addClass/removeClass`方法来改变输入框的大小。...
本资源"jQuery表单浮动文字标签代码.zip"提供了一种创新的解决方案,它实现了表单输入元素的文字标签在不同位置浮动的效果,以增强用户填写表单时的引导体验。 首先,我们要理解“标签上浮动”、“标签右浮动”和...
本项目"jquery表单验证Ajax提交.zip"显然聚焦于使用jQuery进行表单验证和利用Ajax技术无刷新提交数据的核心功能。以下是这些知识点的详细说明: **jQuery库** jQuery是一个轻量级的JavaScript库,它通过提供简洁的...
jQuery是一个广泛使用的JavaScript库,它简化了DOM操作,而jQuery Validate插件则是jQuery的一个扩展,专门用于实现复杂的表单验证功能。本教程将深入探讨如何使用jQuery Validate插件来制作一个用户注册表单,涵盖...
在手机移动端的注册表单验证中,jQuery可以帮助我们实现如实时输入检测、错误提示等交互效果,提升用户填写表单的体验。 在"index.html"文件中,通常会包含HTML结构,包括注册表单的各个输入字段,如用户名、密码、...
"jquery表单美化"是利用jQuery来优化和提升网页表单的视觉效果和用户体验的过程。这个主题涵盖了一系列的技术和方法,包括但不限于以下几点: 1. **CSS样式应用**:jQuery可以方便地与CSS结合,动态改变表单元素的...
**jQuery密码强度智能检测表单** 是一个基于流行的JavaScript库jQuery设计的前端验证工具,用于帮助用户创建更安全的密码。这个工具通过实时评估输入的密码,并根据其复杂度将其分为弱、中、强三个等级,以此来提高...
【jQuery表单操作】jQuery作为一个强大的JavaScript库,极大地简化了前端开发,特别是在处理表单交互时。以下将详细解析给出的四个代码片段,这些代码片段旨在优化和控制表单的行为。 1. **禁止通过回车键提交表单*...
"jQuery表单验证"就是利用jQuery库进行前端验证的方法,它通过添加特定的JavaScript代码来检测用户在表单中的输入是否有效。 首先,我们需要理解jQuery的基本使用。jQuery的核心在于它的选择器,它允许开发者高效地...
本示例将深入探讨如何使用jQuery和Ajax技术来实现表单输入的实时检测和验证,提升用户体验,减少服务器负载。 首先,我们需要理解jQuery的基本用法。jQuery通过选择器(如$("#id")或$(".class"))选取DOM元素,然后...