手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >浅析onsubmit校验表单时利用ajax的return false无效问题
浅析onsubmit校验表单时利用ajax的return false无效问题
摘要:复制代码代码如下:/***表单提交校验**/functiononSubmit(){if($('#name').val().length

复制代码 代码如下:

/**

* 表单提交校验

**/

function onSubmit(){

if($('#name').val().length<2){

alert("名称请不少于两个汉字");

return false;

}

var t = new Date().getTime();

$.ajax({

type: "POST",

url: "/users/checkrepeat/",

data: "name=" + $('#name').val() + "&time=" + t,

success:function(res){

if(res == 'exists'){

alert("名称已存在,请修改.");

return false;

}

}

});

}

问题原因:

1. ajax时return false 的function与onsubmit()不是同一个函数;

2. 在ajax执行时,async默认的设置值为true,这种情况为异步方式,就是说当ajax发送请求后,在等待server端返回的这个过程中,前台会继续 执行ajax块后面的脚本,直到server端返回正确的结果才会去执行success,也就是说这时候执行的是两个线程,ajax块发出请求后一个线程 和ajax块后面的脚本(另一个线程)。

修改后的代码:

复制代码 代码如下:

/**

* 表单提交校验

**/

function onSubmit(){

if($('#name').val().length<2){

alert("名称请不少于两个汉字");

return false;

}

var flag = true;

var t = new Date().getTime();

$.ajax({

type: "POST",

async:false, // 设置同步方式

cache:false,

url: "/users/checkrepeat/",

data: "name=" + $('#name').val() + "&time=" + t,

success:function(res){

if(res == 'exists'){

alert("名称已存在,请修改.");

flag = false;

}

}

});

if(!flag)

return false;

【浅析onsubmit校验表单时利用ajax的return false无效问题】相关文章:

jQuery异步上传文件插件ajaxFileUpload详细介绍

打造个性化的Select(可编辑)

Jquery zTree 树控件异步加载操作

jquery.validate使用时遇到的问题

详解AngularJS中的http拦截

JavaScript TO HTML 转换

Javascript 不能释放内存.

javascript基于DOM实现省市级联下拉框的方法

基于JavaScript实现智能右键菜单

美化下拉列表

精品推荐
分类导航