HTML 表单:(为了使得代码清晰易懂,故删去无用环节)
<form id="registerForm" name="registerForm">
<table>
<tr>
<td>用户名</td>
<td>
<em>*</em>
<input type="text" id="userId" name="user.userId" size="25" />
<span id="checkMessage"></span>
</td>
</tr>
<tr>
<td>密码</td>
<td>
<em>*</em>
<input type="password" id="password" name="user.password" size="25" />
</td>
</tr>
<tr>
<td>确认密码</td>
<td>
<em>*</em>
<input type="password" id="confirmPassword" name="confirmPassword" size="25" />
</td>
</tr>
</table>
</form>JS 文件(基于 Jquery 和 Jquery.validate)
$(document).ready(function() {
// 表单验证
var validator = $("#registerForm").validate( {
rules : {
'user.userId' : {
required : true,
minlength : 6,
checkUserId : true
},
'user.password' : {
required : true,
minlength : 6
},
'confirmPassword' : {
equalTo : "#password"
}
},
messages : {
'user.userId' : {
checkUserId : "&nbsp;"
}
},
errorPlacement : function(error, element) {
if (element.is(":radio")) {
error.appendTo(element.parent().parent("td"));
} else if (element.is(":checkbox")) {
error.appendTo(element.parent().parent("td"));
} else {
error.appendTo(element.parent());
}
},
submitHandler : function(form) {
var params = $("#registerForm").formSerialize();
$.ajax( {
url : "/user/json/register.xhtml",
data : params,
dataType : "json",
type : "post",
async : false,
cache : false,
timeout : 10000,
error : error,
success : success
});
},
success : function(label) {
label.html("&nbsp;").addClass("checked");
},
});
});// 自定义验证方法,注意下面同步配置处
$.validator.addMethod('checkUserId', function(userId, element) {
var result;
$.ajax({
url : "/user/json/checkUserId.xhtml",
data : "user.userId=" + userId,
dataType : "json",
type : "post",
async : true, <-- (1)  
cache : false,
timeout : 10000,
success : function(response) {
result = (response.success === true) ? true : false;
if (result === true) { // 成功
jQuery("#checkMessage").css("color", "#00FF00");
} else {
jQuery("#checkMessage").css("color", "#FF0000");
}
jQuery("#checkMessage").text(response.message);
}
});
return this.optional(element) || result;
});// 请求失败
function error(response) {
alert("服务器没有返回数据,可能服务器忙,请重试...");
}// 请求成功返回
function success(response) {
alert(response.message);
result = (response.success === true) ? true : false;
if (result === true) {
window.location = '/home.xhtml';
}
}问题:
在JS代码中的(1)处,我本想设置为异步(即:true),原因是,在系统验证时用户可以填写后面的信息,不用等待服务器相应信息。
但是,如果(1)处设置为 true,则在所有信息填写完毕后,用户点击提交按钮时,系统无任何反应,也不报异常。如果设置为 false(即:非异步),则可以正常提交表单,但是在验证用户名时,用户必须等待。
请问,我的JS是不是其他地方编写有问题,请各位大哥大姐不吝赐教。
万分感激!

解决方案 »

  1.   

    我已经详细的测试过了,如果去掉自定义验证,则表单提交正常。
    然后是我上面提到的方法,即设置为非异步,表单也可以提交。
    很明显,不是语法问题,一定是 ajax 设置问题。
    请各位继续赐教,不胜感激!
      

  2.   

    1.你alert下服务器返回的数据咯
    2.返回的是json数据,请检查格式
    3.如果你json数据中是用'success':'true',请将response.success === true改为response.success == 'true'
      

  3.   

    里面有很多视频教程
    都是各个大学的 名师主讲,各类学科都有了 速度还行挺快的 
    进去后,进论坛 可以找到详细的学科分类 
    下载地址:
      http://www.abab123.com/bbs/down.asp?html=1375010
      

  4.   

    问题找到了,不能使用自定义的 Ajax 验证方式,而要使用 jquery.validate 的 remote 验证方式可以解决。
    虽然大家没有给出标准答案,但是也十分感谢大家的热心帮助!
    分乃身外之物,还是散给大家吧,呵呵!
    对大家的热心帮助再次表示感谢!