浅析onsubmit校验表单时利用ajax的return false无效问题


Posted in Javascript onJuly 10, 2013
/**
 * 表单提交校验
 **/
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;
Javascript 相关文章推荐
在VS2008中使用jQuery智能感应的方法
Dec 30 Javascript
javascript 基础篇4 window对象,DOM
Mar 14 Javascript
基于jquery库的tab新形式使用
Nov 16 Javascript
Extjs中TabPane如何嵌套在其他网页中实现思路及代码
Jan 27 Javascript
30分钟就入门的正则表达式基础教程
Feb 25 Javascript
为指定的元素添加遮罩层的示例代码
Jan 15 Javascript
Node.js事件循环(Event Loop)和线程池详解
Jan 28 Javascript
JavaScript实现模仿桌面窗口的方法
Jul 18 Javascript
node.js 中国天气预报 简单实现
Jun 06 Javascript
详谈js中window.location.search的用法和作用
Feb 13 Javascript
微信小程序实现自定义modal弹窗封装的方法
Jun 15 Javascript
详解vue中移动端自适应方案
May 05 Javascript
JavaScript 模拟类机制及私有变量的方法及思路
Jul 10 #Javascript
js固定DIV高度,超出部分自动添加滚动条的简单方法
Jul 10 #Javascript
javascript 手动给表增加数据的小例子
Jul 10 #Javascript
基于javascript 闭包基础分享
Jul 10 #Javascript
关于include标签导致js路径找不到的问题分析及解决
Jul 09 #Javascript
等待指定时间后自动跳转或关闭当前页面的js代码
Jul 09 #Javascript
浅析js封装和作用域
Jul 09 #Javascript
You might like
PHP学习之字符串比较和查找
2011/04/17 PHP
php判断变量类型常用方法
2012/04/24 PHP
PHP header()函数使用详细(301、404等错误设置)
2013/04/17 PHP
如何在PHP中使用正则表达式进行查找替换
2013/06/13 PHP
php 去除html标记--strip_tags与htmlspecialchars的区别详解
2013/06/26 PHP
php把数据表导出为Excel表的最简单、最快的方法(不用插件)
2014/05/10 PHP
php返回json数据函数实例
2014/10/09 PHP
基于php流程控制语句和循环控制语句(讲解)
2017/10/23 PHP
向左滚动文字 js代码效果
2013/08/17 Javascript
jquery实现按Enter键触发事件示例
2013/09/10 Javascript
jquery实现图片灯箱明暗的遮罩效果
2013/11/15 Javascript
jQuery实现带动画效果的二级下拉导航方法
2015/03/11 Javascript
jQuery实现折叠、展开的菜单组效果代码
2015/09/16 Javascript
浅析AngularJS中的指令
2016/03/20 Javascript
jQuery DataTables插件自定义Ajax分页实例解析
2020/04/28 Javascript
新手学习前端之js模仿淘宝主页网站
2016/10/31 Javascript
详解HTTPS 的原理和 NodeJS 的实现
2017/07/04 NodeJs
微信小程序获取循环元素id以及wx.login登录操作
2017/08/17 Javascript
jQuery+HTML5实现WebGL高性能烟花绽放动画效果【附demo源码下载】
2017/08/18 jQuery
nodejs实现UDP组播示例方法
2019/11/04 NodeJs
使用 UniApp 实现小程序的微信登录功能
2020/06/09 Javascript
linux系统使用python监测系统负载脚本分享
2014/01/15 Python
OpenCV+python手势识别框架和实例讲解
2018/08/03 Python
python中return的返回和执行实例
2019/12/24 Python
python 通过邮件控制实现远程控制电脑操作
2020/03/16 Python
python实现秒杀商品的微信自动提醒功能(代码详解)
2020/04/27 Python
什么是python的必选参数
2020/06/21 Python
塔吉特百货公司官网:Target
2017/04/27 全球购物
荷兰最大的儿童服装店:The Kids Republic
2019/04/13 全球购物
什么是Remote Module
2016/06/10 面试题
运动会稿件200字
2014/02/07 职场文书
《悯农》教学反思
2014/04/28 职场文书
2014领导班子“四风问题”对照检查材料思想汇报(执法局)
2014/09/21 职场文书
婚宴来宾致辞
2015/07/28 职场文书
公司员工离职感言
2015/08/03 职场文书
酒桌上的祝酒词
2015/08/12 职场文书