ajax异步判断用户名重复,阻止表单提交

[zzw进击的菜鸟]

$("#reg-form").submit(function () {
if (!UsernameValidate() ) {
return false;
}
});
$("#UserName").blur(UsernameValidate)
function UsernameValidate() {
var val;
var name = $("#UserName").val();
$.ajax({
url: '/User/UsernameValidate?name=' + name,
type: 'POST',
async:false,
success: function (data) {
if (data == "null") {
$("#Usernamemessage").text("用户名不能为空");
val = false;
}
else if (data == "repeat") {
$("#Usernamemessage").text("用户名重复");
val = false;
}
else if (data == "pass") {
$("#Usernamemessage").text("");
val = true;
}
}
});
return val;

[zzw进击的菜鸟]

如果把async:false去掉,验证正确提交表单也会被阻止,这是为什么?

[KIDbody]

教你一个实时验证的插件，验证不需要这么麻烦。不需要写这么多重复的验证规则。你百度jquery.Validation，有很多介绍

[KIDbody]

把验证写在UsernameValidate方法里面

[KIDbody]

你去掉async:false就是异步执行ajax，就会使ajax不一定在你前面的验证方法之后执行，因为是异步的。

[以专业开发人员为伍]

要搞懂什么是“异步”！ 函数 UsernameValidate 在还没有访问服务器之前，就立刻返回了，它不会等 val 有所改变就直接返回 false 了。因此你的代码说明你还没有理解“异步、回调”的基本机制。因此你的这个设计，整体上必定失败。 你需要捕获相应按钮的click 事件（而不是 reg-form 的 submit），然后在 UsernameValidate 经过 success 回调之后，再来调用form 的submit 方法。把思路理清楚了先。

[以专业开发人员为伍]

引用 1 楼 qin122333 的回复:

如果把async:false去掉,验证正确提交表单也会被阻止,这是为什么?

异步程序是为了提高用户体验，因此必定要把 async:false 去掉的。因此要按照异步机制来设计程序，它与同步执行的程序设计思路完全不同！不要用异步的编程语法来模拟同步操作。

[zzw进击的菜鸟]

恩,懂了,ajax初学,有点吃力

[奋斗的小壁虎]

这是没搞懂的Ajax怎么用啊，楼上点评参考吧