jQuery的ajax的form提交方法应用 - 推酷
jQuery的ajax的form提交方法应用
1.如果不用ajax的form提交，就必须把表单的每一条数据进行获取，并提交给action进行处理。这样做比较麻烦，现在用了jQuery的easyui，使用封装好的ajax的form提交。脚本代码如下：
//提交表单
function sysusersave(){
if($.formValidator.pageIsValid()){//校验表单输入信息是否合法
//使用jquery的ajax from提交，指定from的id和回调方法，提交的url使用提from中的action，参数为空，传递JSON字符串（去掉也不报错）
jquerySubByFId('sysusereditform',sysusersave_callback,null,&json&);
//from提交的回调方法,data是提交的返回的数据
function sysusersave_callback(data){
message_alert(data);
注意：上面的回调函数，是action处理后，返回JSON的数据传给了参数data。
上面函数具体的实现（没有封装的代码）：要传递四个参数
*form提交(post方式)
*formId form Id
*callbackfn 回调函数名(要求函数必须有参数且不能多与两个,一个参数时参数为响应文本,两个参数时第一个参数为响应文本)
*param 回调函数参数(如果为null,那么调用一个参数的回调函数,否则调用两个参数的回调函数)
function jquerySubByFId(formId,callbackFn,param,dataType){
var formObj = jQuery(&#& + formId);
var options = {
(&undefined&!=dataType && null!=dataType)?dataType:&json&,
success: function(responseText) {
if(param === null){
callbackFn(responseText);
callbackFn(responseText,param);
formObj.ajaxSubmit(options);
2.校验表单输入信息是否合法：使用的是jQuery easyui的内置校验器，如下 ，列举出来的对用户账号进行的校验：
$(function (){
/******表单校验*************/
$.formValidator.initConfig({
formID : &sysusereditform&,
theme : &Default&,
onError : function(msg, obj, errorlist) {
//alert(msg);
//用户账号
$(&#sysuser_userid&).formValidator({
onShow : &&,
onCorrect:& &
}).inputValidator({
onError : &请输入用户账号(最长10个字符)&
校验的具体方法：
//====================================================================================================
// [插件名称] jQuery formValidator
//----------------------------------------------------------------------------------------------------
述] jQuery formValidator表单验证插件，它是基于jQuery类库，实现了js脚本于页面的分离。对一个表
单对象，你只需要写一行代码就可以轻松实现20种以上的脚本控制。现支持一个表单元素累加很多种
校验方式,采用配置信息的思想，而不是把信息写在表单元素上，能比较完美的实现ajax请求。
//----------------------------------------------------------------------------------------------------
// [作者网名] 猫冬
// [作者博客]
// [QQ群交流]
// [更新日期]
// [版 本 号] ver4.0.1
//====================================================================================================
(function($) {
$.formValidator =
//全局配置
initConfig : function(controlOptions)
var settings =
debug:false,
//调试模式
validatorGroup : &1&,
alertMessage:false,
//是否为弹出窗口提示模式
validObjects:[],
//参加校验的控件集合
ajaxObjects:&&,
//传到服务器的控件列表
forceValid:false,
//控件输入正确之后，才允许失去焦点
onSuccess: function() {},
//提交成功后的回调函数
onError: $.noop,
//提交失败的回调函数
submitOnce:false,
//页面是否提交一次，不会停留
formID:&&,
submitButtonID:&&,
//提交按钮ID
autoTip: false,
//是否自动构建提示层
tidyMode:false,
//精简模式
errorFocus:true,
//第一个错误的控件获得焦点
wideWord:true,
//一个汉字当做2个长度
status:&&,
//提交的状态：submited、sumbiting、sumbitingWithAjax
submitAfterAjaxPrompt : &当前有数据正在进行服务器端校验，请稍候&, //控件失去焦点后，触发ajax校验，没有返回结果前的错误提示
validCount:0,
//含ajaxValidator的控件个数
ajaxCountSubmit:0,
//提交的时候触发的ajax验证个数
ajaxCountValid:0,
//失去焦点时候触发的ajax验证个数
inIframe:false
controlOptions = controlOptions || {};
$.extend(settings, controlOptions);
//如果是精简模式，发生错误的时候，第一个错误的控件就不获得焦点
if(settings.tidyMode){settings.errorFocus=false};
//如果填写了表单和按钮，就注册验证事件
if(settings.formID!=&&){
$(&#&+settings.formID).submit(function(){return $.formValidator.bindSubmit(settings);});
else if(settings.submitButtonID!=&&)
$(&#&+settings.submitButtonID).click(function(){return $.formValidator.bindSubmit(settings);});
$('body').data(settings.validatorGroup, settings);
//调用验证函数
bindSubmit : function(settings)
if (settings.ajaxCountValid & 0 && settings.submitAfterAjaxPrompt != &&) {
alert(settings.submitAfterAjaxPrompt);
return $.formValidator.pageIsValid(settings.validatorGroup);
//各种校验方式支持的控件类型
sustainType : function(id,setting)
var elem = $(&#&+id).get(0);
var srcTag = elem.tagN
var stype = elem.
switch(setting.validateType)
case &InitValidator&:
case &InputValidator&:
return (srcTag == &INPUT& || srcTag == &TEXTAREA& || srcTag == &SELECT&);
case &CompareValidator&:
return ((srcTag == &INPUT& || srcTag == &TEXTAREA&) ? (stype != &checkbox& && stype != &radio&) : false);
case &AjaxValidator&:
return (stype == &text& || stype == &textarea& || stype == &file& || stype == &password& || stype == &select-one&);
case &RegexValidator&:
return ((srcTag == &INPUT& || srcTag == &TEXTAREA&) ? (stype != &checkbox& && stype != &radio&) : false);
case &FunctionValidator&:
//如果validator对象对应的element对象的validator属性追加要进行的校验。
appendValid : function(id, setting )
//如果是各种校验不支持的类型，就不追加到。返回-1表示没有追加成功
if(!$.formValidator.sustainType(id,setting)) return -1;
var srcjo = $(&#&+id).get(0);
//重新初始化
if (setting.validateType==&InitValidator& || srcjo.settings == undefined ){srcjo.settings = new Array();}
var len = srcjo.settings.push( setting );
srcjo.settings[len - 1].index = len - 1;
return len - 1;
//设置显示信息
setTipState : function(elem,showclass,showmsg)
var initConfig = $('body').data(elem.validatorGroup);
var tip = $(&#&+elem.settings[0].tipID);
if(showmsg==null || showmsg==&&)
tip.hide();
if(initConfig.tidyMode)
//显示和保存提示信息
$(&#fv_content&).html(showmsg);
elem.Tooltip =
if(showclass!=&onError&){tip.hide();}
tip.show().removeClass().addClass( showclass ).html( showmsg );
//把提示层重置成原始提示(如果有defaultPassed,应该设置为onCorrect)
resetTipState : function(validatorGroup)
if(validatorGroup == undefined){validatorGroup = &1&};
var initConfig = $('body').data(validatorGroup);
$.each(initConfig.validObjects,function(){
var elem = this.get(0);
var setting = elem.settings[0];
var passed = setting.defaultP
$.formValidator.setTipState(elem, passed ? &onCorrect& : &onShow&, passed ? setting.onCorrect : setting.onShow);
//设置错误的显示信息
setFailState : function(tipID,showmsg)
var tip = $(&#&+tipID);
tip.removeClass().addClass(&onError&).html(showmsg);
//根据单个对象,正确:正确提示,错误:错误提示
showMessage : function(returnObj)
var id = returnObj.
var elem = $(&#&+id).get(0);
var isValid = returnObj.isV
var setting = returnObj.//正确:setting[0],错误:对应的setting[i]
var showmsg = &&,showclass = &&;
var intiConfig = $('body').data(elem.validatorGroup);
if (!isValid)
showclass = &onError&;
if(setting.validateType==&AjaxValidator&)
if(setting.lastValid==&&)
showclass = &onLoad&;
showmsg = setting.onW
showmsg = setting.onE
showmsg = (returnObj.errormsg==&&? setting.onError : returnObj.errormsg);
if(intiConfig.alertMessage)
if(elem.validValueOld!=$(elem).val()){alert(showmsg);}
$.formValidator.setTipState(elem,showclass,showmsg);
//验证成功后,如果没有设置成功提示信息,则给出默认提示,否则给出自定义提示;允许为空,值为空的提示
showmsg = $.formValidator.isEmpty(id) ? setting.onEmpty : setting.onC
$.formValidator.setTipState(elem,&onCorrect&,showmsg);
showAjaxMessage : function(returnObj)
var elem = $(&#&+returnObj.id).get(0);
var setting = elem.settings[returnObj.ajax];
var validValueOld = elem.validValueO
var validvalue = $(elem).val();
returnObj.setting =
//defaultPassed还未处理
if(validValueOld!= validvalue || validValueOld == validvalue && !elem.onceValided)
$.formValidator.ajaxValid(returnObj);
if(setting.isValid!=undefined && !setting.isValid){
elem.lastshowclass = &onError&;
elem.lastshowmsg = setting.onE
$.formValidator.setTipState(elem,elem.lastshowclass,elem.lastshowmsg);
//获取指定字符串的长度
getLength : function(id)
var srcjo = $(&#&+id);
var elem = srcjo.get(0);
var sType = elem.
var len = 0;
switch(sType)
case &text&:
case &hidden&:
case &password&:
case &textarea&:
case &file&:
var val = srcjo.val();
var initConfig = $('body').data(elem.validatorGroup);
if (initConfig.wideWord)
for (var i = 0; i & val. i++)
len = len + ((val.charCodeAt(i) &= 0x4e00 && val.charCodeAt(i) &= 0x9fa5) ? 2 : 1);
len = val.
case &checkbox&:
case &radio&:
len = $(&input[type='&+sType+&'][name='&+srcjo.attr(&name&)+&']:checked&).
case &select-one&:
len = elem.options ? elem.options.selectedIndex : -1;
case &select-multiple&:
len = $(&select[name=&+elem.name+&] option:selected&).
//结合empty这个属性，判断仅仅是否为空的校验情况。
isEmpty : function(id)
return ($(&#&+id).get(0).settings[0].empty && $.formValidator.getLength(id)==0);
//对外调用：判断单个表单元素是否验证通过，不带回调函数
isOneValid : function(id)
return $.formValidator.oneIsValid(id).isV
//验证单个是否验证通过,正确返回settings[0],错误返回对应的settings[i]
oneIsValid : function (id)
var returnObj = new Object();
var elem = $(&#&+id).get(0);
returnObj.initConfig = $('body').data(elem.validatorGroup);
returnObj.id =
returnObj.ajax = -1;
returnObj.errormsg = &&;
//自定义错误信息
var settings = elem.
var settingslen = settings.
var validateT
//只有一个formValidator的时候不检验
if (settingslen==1){settings[0].bind=}
if(!settings[0].bind){}
for ( var i = 0 ; i & i ++ )
//如果为空，直接返回正确
if($.formValidator.isEmpty(id)){
returnObj.isValid =
returnObj.setting = settings[0];
returnObj.setting = settings[i];
validateType = settings[i].validateT
//根据类型触发校验
switch(validateType)
case &InputValidator&:
$.formValidator.inputValid(returnObj);
case &CompareValidator&:
$.pareValid(returnObj);
case &RegexValidator&:
$.formValidator.regexValid(returnObj);
case &FunctionValidator&:
$.formValidator.functionValid(returnObj);
case &AjaxValidator&:
//如果是ajax校验，这里直接取上次的结果值
returnObj.ajax = i
//校验过一次
elem.onceValided =
if(!settings[i].isValid) {
returnObj.isValid =
returnObj.setting = settings[i];
returnObj.isValid =
returnObj.setting = settings[0];
if (settings[i].validateType == &AjaxValidator&){break};
return returnO
//验证所有需要验证的对象，并返回是否验证成功（如果曾经触发过ajaxValidator，提交的时候就不触发校验，直接读取结果）
pageIsValid : function (validatorGroup)
if(validatorGroup == undefined){validatorGroup = &1&};
var isValid = true,returnObj,firstErrorMessage=&&,errorM
var error_tip = &^&,thefirstid,name,name_list=&^&;
var errorlist = new Array();
//设置提交状态、ajax是否出错、错误列表
var initConfig = $('body').data(validatorGroup);
initConfig.status = &sumbiting&;
initConfig.ajaxCountSubmit = 0;
//遍历所有要校验的控件,如果存在ajaxValidator就先直接触发
$.each(initConfig.validObjects,function()
if (this.settings[0].bind && this.validatorAjaxIndex!=undefined && this.onceValided == undefined) {
returnObj = $.formValidator.oneIsValid(this.id);
if (returnObj.ajax == this.validatorAjaxIndex) {
initConfig.status = &sumbitingWithAjax&;
$.formValidator.ajaxValid(returnObj);
//如果有提交的时候有触发ajaxValidator，所有的处理都放在ajax里处理
if(initConfig.ajaxCountSubmit & 0){return false}
//遍历所有要校验的控件
$.each(initConfig.validObjects,function()
//只校验绑定的控件
if(this.settings[0].bind){
name = this.
//相同name只校验一次
if (name_list.indexOf(&^&+name+&^&) == -1) {
onceValided = this.onceValided == undefined ? false : this.onceV
if(name){name_list = name_list + name + &^&};
returnObj = $.formValidator.oneIsValid(this.id);
if (returnObj) {
//校验失败,获取第一个发生错误的信息和ID
if (!returnObj.isValid) {
//记录不含ajaxValidator校验函数的校验结果
errorMessage = returnObj.errormsg == && ? returnObj.setting.onError : returnObj.
errorlist[errorlist.length] = errorM
if (thefirstid == null) {thefirstid = returnObj.id};
if(firstErrorMessage==&&){firstErrorMessage=errorMessage};
//为了解决使用同个TIP提示问题:后面的成功或失败都不覆盖前面的失败
if (!initConfig.alertMessage) {
var tipID = this.settings[0].tipID;
if (error_tip.indexOf(&^& + tipID + &^&) == -1) {
if (!returnObj.isValid) {error_tip = error_tip + tipID + &^&};
$.formValidator.showMessage(returnObj);
//成功或失败进行回调函数的处理，以及成功后的灰掉提交按钮的功能
if(isValid)
initConfig.onSuccess();
if(initConfig.submitOnce){$(&:submit,:button,:reset&).attr(&disabled&,true);}
initConfig.onError(firstErrorMessage, $(&#& + thefirstid).get(0), errorlist);
if (thefirstid && initConfig.errorFocus) {$(&#& + thefirstid).focus()};
initConfig.status=&init&;
return !initConfig.debug && isV
//ajax校验
ajaxValid : function(returnObj)
var id = returnObj.
var srcjo = $(&#&+id);
var elem = srcjo.get(0);
var initConfig = returnObj.initC
var settings = elem.
var setting = settings[returnObj.ajax];
var ls_url = setting.
//获取要传递的参数
var validatorGroup = elem.validatorG
var initConfig = $('body').data(validatorGroup);
var parm = $(initConfig.ajaxObjects).serialize();
//添加触发的控件名、随机数、传递的参数
parm = &clientid=& + id + &&& +(setting.randNumberName ? setting.randNumberName+&=&+((new Date().getTime())+Math.round(Math.random() * 10000)) : &&) + (parm.length & 0 ? &&& + parm : &&);
ls_url = ls_url + (ls_url.indexOf(&?&) & -1 ? (&&& + parm) : (&?& + parm));
//发送ajax请求
type : setting.type,
url : ls_url,
cache : setting.cache,
data : setting.data,
async : setting.async,
timeout : setting.timeout,
dataType : setting.dataType,
success : function(data, textStatus, jqXHR){
var lb_ret,ls_status,ls_
$.formValidator.dealAjaxRequestCount(validatorGroup,-1);
//根据业务判断设置显示信息
lb_ret = setting.success(data, textStatus, jqXHR);
setting.isValid = lb_
if(lb_ret){
ls_status = &onCorrect&;
ls_msg = settings[0].onC
ls_status = &onError&;
ls_msg = setting.onE
$.formValidator.setTipState(elem,ls_status,ls_msg);
//提交的时候触发了ajax校验，等ajax校验完成，无条件重新校验
if(returnObj.initConfig.status==&sumbitingWithAjax& && returnObj.initConfig.ajaxCountSubmit == 0)
if (initConfig.formID != &&) {
$('#' + initConfig.formID).trigger('submit');
}else if (initConfig.formID != &&){
$('#' + initConfig.submitButtonID).trigger('click');
complete : function(jqXHR, textStatus){
if(setting.buttons && setting.buttons.length & 0){setting.buttons.attr({&disabled&:false})};
plete(jqXHR, textStatus);
beforeSend : function(jqXHR, configs){
//本控件如果正在校验，就中断上次
if (this.lastXMLHttpRequest) {this.lastXMLHttpRequest.abort()};
this.lastXMLHttpRequest = jqXHR;
//再服务器没有返回数据之前，先回调提交按钮
if(setting.buttons && setting.buttons.length & 0){setting.buttons.attr({&disabled&:true})};
var isValid = setting.beforeSend(jqXHR,configs);
if(isValid)
setting.isValid =
//如果前面ajax请求成功了，再次请求之前先当作错误处理
$.formValidator.setTipState(elem,&onLoad&,settings[returnObj.ajax].onWait);
setting.lastValid = &-1&;
if(isValid){$.formValidator.dealAjaxRequestCount(validatorGroup,1);}
return isV
error : function(jqXHR, textStatus, errorThrown){
$.formValidator.dealAjaxRequestCount(validatorGroup,-1);
$.formValidator.setTipState(elem,&onError&,setting.onError);
setting.isValid =
setting.error(jqXHR, textStatus, errorThrown);
processData : setting.processData
//处理ajax的请求个数
dealAjaxRequestCount : function(validatorGroup,val)
var initConfig = $('body').data(validatorGroup);
initConfig.ajaxCountValid = initConfig.ajaxCountValid +
if (initConfig.status == &sumbitingWithAjax&) {
initConfig.ajaxCountSubmit = initConfig.ajaxCountSubmit +
//对正则表达式进行校验（目前只针对input和textarea）
regexValid : function(returnObj)
var id = returnObj.
var setting = returnObj.
var srcTag = $(&#&+id).get(0).tagN
var elem = $(&#&+id).get(0);
//如果有输入正则表达式，就进行表达式校验
if(elem.settings[0].empty && elem.value==&&){
setting.isValid =
var regexArray = setting.regE
setting.isValid =
if((typeof regexArray)==&string&) regexArray = [regexArray];
$.each(regexArray, function() {
if(setting.dataType==&enum&){r = eval(&regexEnum.&+r);}
if(r==undefined || r==&&)
isValid = (new RegExp(r, setting.param)).test($(elem).val());
pareType==&||& && isValid)
setting.isValid =
pareType==&&&& && !isValid)
return false
if(!setting.isValid) setting.isValid = isV
//函数校验。返回true/false表示校验是否成功;返回字符串表示错误信息，校验失败;如果没有返回值表示处理函数，校验成功
functionValid : function(returnObj)
var id = returnObj.
var setting = returnObj.
var srcjo = $(&#&+id);
var lb_ret = setting.fun(srcjo.val(),srcjo.get(0));
if(lb_ret != undefined)
if((typeof lb_ret) === &string&){
setting.isValid =
returnObj.errormsg = lb_
setting.isValid = lb_
//对input和select类型控件进行校验
inputValid : function(returnObj)
var id = returnObj.
var setting = returnObj.
var srcjo = $(&#&+id);
var elem = srcjo.get(0);
var val = srcjo.val();
var sType = elem.
var len = $.formValidator.getLength(id);
var empty = setting.empty,emptyError =
switch(sType)
case &text&:
case &hidden&:
case &password&:
case &textarea&:
case &file&:
if (setting.type == &size&) {
empty = setting.
if(!empty.leftEmpty){
emptyError = (val.replace(/^[ \s]+/, '').length != val.length);
if(!emptyError && !empty.rightEmpty){
emptyError = (val.replace(/[ \s]+$/, '').length != val.length);
if(emptyError && empty.emptyError){returnObj.errormsg= empty.emptyError}
case &checkbox&:
case &select-one&:
case &select-multiple&:
case &radio&:
var lb_go_on =
if(sType==&select-one& || sType==&select-multiple&){setting.type = &size&;}
var type = setting.
if (type == &size&) {
//获得输入的字符长度，并进行校验
if(!emptyError){lb_go_on = true}
if(lb_go_on){val = len}
else if (type ==&date& || type ==&datetime&)
var isok =
if(type==&date&){lb_go_on = isDate(val)};
if(type==&datetime&){lb_go_on = isDate(val)};
if(lb_go_on){val = new Date(val);setting.min=new Date(setting.min);setting.max=new Date(setting.max);};
stype = (typeof setting.min);
if(stype ==&number&)
val = (new Number(val)).valueOf();
if(!isNaN(val)){lb_go_on =}
if(stype ==&string&){lb_go_on =}
setting.isValid =
if(lb_go_on)
if(val & setting.min || val & setting.max){
if(val & setting.min && setting.onErrorMin){
returnObj.errormsg= setting.onErrorM
if(val & setting.min && setting.onErrorMax){
returnObj.errormsg= setting.onErrorM
setting.isValid =
//对两个控件进行比较校验
compareValid : function(returnObj)
var id = returnObj.
var setting = returnObj.
var srcjo = $(&#&+id);
var desjo = $(&#&+setting.desID );
var ls_dataType = setting.dataT
curvalue = srcjo.val();
ls_data = desjo.val();
if(ls_dataType==&number&)
if(!isNaN(curvalue) && !isNaN(ls_data)){
curvalue = parseFloat(curvalue);
ls_data = parseFloat(ls_data);
if(ls_dataType==&date& || ls_dataType==&datetime&)
var isok =
if(ls_dataType==&date&){isok = (isDate(curvalue) && isDate(ls_data))};
if(ls_dataType==&datetime&){isok = (isDateTime(curvalue) && isDateTime(ls_data))};
curvalue = new Date(curvalue);
ls_data = new Date(ls_data)
switch(setting.operateor)
setting.isValid = (curvalue == ls_data);
case &!=&:
setting.isValid = (curvalue != ls_data);
setting.isValid = (curvalue & ls_data);
case &&=&:
setting.isValid = (curvalue &= ls_data);
setting.isValid = (curvalue & ls_data);
case &&=&:
setting.isValid = (curvalue &= ls_data);
setting.isValid =
//定位漂浮层
localTooltip : function(e)
e = e || window.
var mouseX = e.pageX || (e.clientX ? e.clientX + document.body.scrollLeft : 0);
var mouseY = e.pageY || (e.clientY ? e.clientY + document.body.scrollTop : 0);
$(&#fvtt&).css({&top&:(mouseY+2)+&px&,&left&:(mouseX-40)+&px&});
reloadAutoTip : function(validatorGroup)
if(validatorGroup == undefined) validatorGroup = &1&;
var initConfig = $('body').data(validatorGroup);
$.each(initConfig.validObjects,function()
if(initConfig.autoTip && !initConfig.tidyMode)
//获取层的ID、相对定位控件的ID和坐标
var setting = this.settings[0];
var relativeID = &#&+setting.relativeID;
var offset = $(relativeID ).offset();
var y = offset.
var x = $(relativeID ).width() + offset.
$(&#&+setting.tipID).parent().show().css({left: x+&px&, top: y+&px&});
//每个校验控件必须初始化的
$.fn.formValidator = function(cs)
var setting =
validatorGroup : &1&,
empty :false,
autoModify : false,
onShow :&请输入内容&,
onFocus: &请输入内容&,
onCorrect: &输入正确&,
onEmpty: &输入内容为空&,
defaultValue : null,
bind : true,
ajax : false,
validateType : &InitValidator&,
&left& : &10px&,
&top& : &1px&,
&height& : &20px&,
&width&:&250px&
triggerEvent:&blur&,
forceValid : false,
tipID : null,
relativeID : null,
//获取该校验组的全局配置信息
cs = cs || {};
if(cs.validatorGroup == undefined){cs.validatorGroup = &1&};
var initConfig = $('body').data(cs.validatorGroup);
//校验索引号，和总记录数
initConfig.validCount += 1;
//如果为精简模式，tipCss要重新设置初始值
if(initConfig.tidyMode){setting.tipCss = {&left& : &2px&,&width&:&22px&,&height&:&22px&,&display&:&none&}};
//弹出消息提示模式，自动修复错误
if(initConfig.alertMessage){setting.autoModify=true};
//先合并整个配置(深度拷贝)
$.extend(true,setting, cs);
return this.each(function(e)
//记录该控件的校验顺序号和校验组号
this.validatorIndex = initConfig.validCount - 1;
this.validatorGroup = cs.validatorG
var jqobj = $(this);
//自动形成TIP
var setting_temp = {};
$.extend(true,setting_temp, setting);
var tip = setting_temp.tipID ? setting_temp.tipID : this.id+&Tip&;
if(initConfig.autoTip)
if(!initConfig.tidyMode)
//获取层的ID、相对定位控件的ID和坐标
if($(&body [id=&+tip+&]&).length==0)
var relativeID = setting_temp.relativeID ? setting_temp.relativeID : this.
var offset = $(&#&+relativeID ).position();
var y = offset.
var x = $(&#&+relativeID ).width() + offset.
var formValidateTip = $(&&div class='formValidateTip'&&/div&&);
if(initConfig.inIframe){formValidateTip.hide();}
formValidateTip.appendTo($(&body&)).css({left: x+&px&, top: y+&px&}).prepend($('&div id=&'+tip+'&&&/div&').css(setting_temp.tipCss));
setting.relativeID = relativeID ;
jqobj.showTooltips();
//每个控件都要保存这个配置信息、为了取数方便，冗余一份控件总体配置到控件上
setting.tipID =
$.formValidator.appendValid(this.id,setting);
//保存控件ID
if($.inArray(jqobj,initConfig.validObjects) == -1)
if (setting_temp.ajax) {
var ajax = initConfig.ajaxO
initConfig.ajaxObjects = ajax + (ajax != && ? &,#& : &#&) + this.
initConfig.validObjects.push(this);
//初始化显示信息
if(!initConfig.alertMessage){
$.formValidator.setTipState(this,&onShow&,setting.onShow);
var srcTag = this.tagName.toLowerCase();
var stype = this.
var defaultval = setting.defaultV
//处理默认值
if(defaultval){
jqobj.val(defaultval);
if(srcTag == &input& || srcTag==&textarea&)
//注册获得焦点的事件。改变提示对象的文字和样式，保存原值
jqobj.focus(function()
if(!initConfig.alertMessage){
//保存原来的状态
var tipjq = $(&#&+tip);
this.lastshowclass = tipjq.attr(&class&);
this.lastshowmsg = tipjq.html();
$.formValidator.setTipState(this,&onFocus&,setting.onFocus);
if (stype == &password& || stype == &text& || stype == &textarea& || stype == &file&) {
this.validValueOld = jqobj.val();
//注册失去焦点的事件。进行校验，改变提示对象的文字和样式；出错就提示处理
jqobj.bind(setting.triggerEvent, function(){
var settings = this.
var returnObj = $.formValidator.oneIsValid(this.id);
if(returnObj==null){}
if(returnObj.ajax &= 0)
$.formValidator.showAjaxMessage(returnObj);
var showmsg = $.formValidator.showMessage(returnObj);
if(!returnObj.isValid)
//自动修正错误
var auto = setting.autoModify && (this.type==&text& || this.type==&textarea& || this.type==&file&);
$(this).val(this.validValueOld);
if(!initConfig.alertMessage){$.formValidator.setTipState(this,&onShow&,setting.onShow)};
if(initConfig.forceValid || setting.forceValid){
alert(showmsg);this.focus();
else if (srcTag == &select&)
jqobj.bind({
//获得焦点
focus: function(){
if (!initConfig.alertMessage) {
$.formValidator.setTipState(this, &onFocus&, setting.onFocus)
//失去焦点
blur: function(){$(this).trigger(&change&)},
//选择项目后触发
change: function(){
var returnObj = $.formValidator.oneIsValid(this.id);
if(returnObj==null){}
if ( returnObj.ajax &= 0){
$.formValidator.showAjaxMessage(returnObj);
$.formValidator.showMessage(returnObj);
$.fn.inputValidator = function(controlOptions)
var settings =
isValid : false,
type : &size&,
onError:&输入错误&,
validateType:&InputValidator&,
empty:{leftEmpty:true,rightEmpty:true,leftEmptyError:null,rightEmptyError:null}
controlOptions = controlOptions || {};
$.extend(true, settings, controlOptions);
return this.each(function(){
$.formValidator.appendValid(this.id,settings);
$.fn.compareValidator = function(controlOptions)
var settings =
isValid : false,
desID : &&,
operateor :&=&,
onError:&输入错误&,
validateType:&CompareValidator&
controlOptions = controlOptions || {};
$.extend(true, settings, controlOptions);
return this.each(function(){
$.formValidator.appendValid(this.id,settings);
$.fn.regexValidator = function(controlOptions)
var settings =
isValid : false,
regExp : &&,
param : &i&,
dataType : &string&,
compareType : &||&,
onError:&输入的格式不正确&,
validateType:&RegexValidator&
controlOptions = controlOptions || {};
$.extend(true, settings, controlOptions);
return this.each(function(){
$.formValidator.appendValid(this.id,settings);
$.fn.functionValidator = function(controlOptions)
var settings =
isValid : true,
fun : function(){this.isValid =},
validateType:&FunctionValidator&,
onError:&输入错误&
controlOptions = controlOptions || {};
$.extend(true, settings, controlOptions);
return this.each(function(){
$.formValidator.appendValid(this.id,settings);
$.fn.ajaxValidator = function(controlOptions)
var settings =
type : &GET&,
dataType : &html&,
timeout : 100000,
data : null,
async : true,
cache : false,
beforeSend : function(){},
success : function(){},
complete : function(){},
processData : true,
error : function(){},
isValid : false,
lastValid : &&,
buttons : null,
oneceValid : false,
randNumberName : &rand&,
onError:&服务器校验没有通过&,
onWait:&正在等待服务器返回数据&,
ajaxExistsError:&前面的校验尚未完成，请稍候...&,
validateType:&AjaxValidator&
controlOptions = controlOptions || {};
$.extend(true, settings, controlOptions);
return this.each(function()
var initConfig = $('body').data(this.validatorGroup);
var ajax = initConfig.ajaxO
if((ajax+&,&).indexOf(&#&+this.id+&,&) == -1)
initConfig.ajaxObjects = ajax + (ajax != && ? &,#& : &#&) + this.
this.validatorAjaxIndex = $.formValidator.appendValid(this.id,settings);
//指定控件显示通过或不通过样式
$.fn.defaultPassed = function(onShow)
return this.each(function()
var settings = this.
settings[0].defaultPassed =
for ( var i = 1 ; i & settings. i ++ )
settings[i].isValid =
if(!$('body').data(settings[0].validatorGroup).alertMessage){
var ls_style = onShow ? &onShow& : &onCorrect&;
$.formValidator.setTipState(this,ls_style,settings[0].onCorrect);
//指定控件不参加校验
$.fn.unFormValidator = function(unbind)
return this.each(function()
this.settings[0].bind = !
if(unbind){
$(&#&+this.settings[0].tipID).hide();
$(&#&+this.settings[0].tipID).show();
//显示漂浮显示层
$.fn.showTooltips = function()
if($(&body [id=fvtt]&).length==0){
fvtt = $(&&div id='fvtt' style='position:z-index:56002'&&/div&&);
$(&body&).append(fvtt);
fvtt.before(&&iframe src='about:blank' class='fv_iframe' scrolling='no' frameborder='0'&&/iframe&&);
return this.each(function()
jqobj = $(this);
s = $(&&span class='top' id=fv_content style='display:block'&&/span&&);
b = $(&&b class='bottom' style='display:block' /&&);
this.tooltip = $(&&span class='fv_tooltip' style='display:block'&&/span&&).append(s).append(b).css({&filter&:&alpha(opacity:95)&,&KHTMLOpacity&:&0.95&,&MozOpacity&:&0.95&,&opacity&:&0.95&});
//注册事件
jqobj.bind({
mouseover : function(e){
$(&#fvtt&).append(this.tooltip);
$(&#fv_content&).html(this.Tooltip);
$.formValidator.localTooltip(e);
mouseout : function(){
$(&#fvtt&).empty();
mousemove: function(e){
$(&#fv_content&).html(this.Tooltip);
$.formValidator.localTooltip(e);
})(jQuery);
使用这些已经写好的方法来处理表单数据，要导入对应的js库
以下HTML的代码是把项目中应用到的js库引入到程序中：
&script type=&text/javascript& src=&${baseurl}js/jquery-1.4.4.min.js&&&/script&
&SCRIPT type=&text/javascript& src=&${baseurl}js/easyui/jquery.easyui.min.1.2.2.js&&&/SCRIPT&
&script type=&text/javascript& src=&${baseurl}js/easyui/locale/easyui-lang-zh_CN.js&&&/script&
&script type=&text/javascript& src=&${baseurl}js/jquery.form.min.js&&&/script&
&script type=&text/javascript& src=&${baseurl}js/custom.jquery.form.js&&&/script&
&script type=&text/javascript& src=&${baseurl}js/custom.box.main.js&&&/script&
&script type=&text/javascript& src=&${baseurl}js/jquery.ajax.custom.extend.js&&&/script&
&SCRIPT type=&text/javascript& src=&${baseurl}js/menuload.js&&&/SCRIPT&
&script type=&text/javascript& src=&${baseurl}js/My97DatePicker/WdatePicker.js&&&/script&
&script src=&${baseurl}js/jqueryvalidator/formValidator-4.1.3.js& type=&text/javascript& charset=&UTF-8&&&/script&
&script src=&${baseurl}js/jqueryvalidator/formValidatorRegex.js& type=&text/javascript& charset=&UTF-8&&&/script&
&script type='text/javascript' src='${baseurl}dwr/engine.js'&&/script&
&script type='text/javascript' src='${baseurl}dwr/util.js'&&/script&
&script type='text/javascript' src='${baseurl}dwr/interface/dwrService.js'&&/script&
已发表评论数()
已收藏到推刊！
请填写推刊名
描述不能大于100个字符!
权限设置： 公开
仅自己可见
正文不准确
排版有问题
没有分页内容
视频无法显示
图片无法显示}