zoukankan      html  css  js  c++  java
  • JavaScript 回调函数中的 return false 问题

    今天一个同事问了我一个问题,就是在 Ajax 方法中,请求成功后(success)的回调函数中根据响应的值来判断程序是否继续执行,他不解的是在回调函数中已经 return false 了,但是 Ajax 方法外部的后续语句却仍然继续执行。他的代码类似于:

        $(function(){
            $.ajax({
                async:false,
                type:"post",
                data:{
                    "username":"dee"
                },
                url:"ajax.php",
                success:function(data){
                    if(data.code != 200){
                          return false;
                    }
                }
            });
            console.log("continue");
        });        

    即返回值不是 200 的时候,希望程序终止执行。但是程序却仍然向下执行,打印出了 "continue"。

    这里他把 Ajax 方法设为同步请求(async:false)是对的,但是他没有理解在 return false 时发生了什么。当调用 return false 时,实际上有三个处理过程:

    1.event.preventDefault(); —— 阻止浏览器默认的行为
    2.event.stopPropagation();  —— 停止事件冒泡
    3.停止回调函数执行并立即返回

    在以上代码的回调函数部分中执行了 return false,就表示停止回调函数执行并立即返回,不再履行函数内的代码,但函数外的代码仍然会执行。因此,程序在 Ajax 方法外的后续语句中继续执行。

    如果要达到返回值不是 200 的情况下,终止程序执行,可以在全局范围内声明一个变量,并且在 Ajax 方法中给该变量重新赋值,然后在 Ajax方法外的后续语句中判断该全局变量的值,代码如下:

        $(function(){
            var flag = 1;
            $.ajax({
                async:false,
                type:"post",
                data:{
                    "username":"dee"
                },
                url:"ajax.php",
                success:function(data){
                    if(data.code != 200){
                        flag = 0;
                    }
                }
            });
            if(flag == 0){
                return false;
            }
            console.log("continue");
        });

    注意:在这里需要把 Ajax 方法的 async 设为 false,即同步请求,此时 Ajax 方法的行为就像一个普通函数,浏览器会一直等待请求完成,然后才会执行脚本的后续语句。

    参考:http://www.jb51.net/article/42711.htm

  • 相关阅读:
    centos8上添加sudoer用户
    centos平台scp通过密钥远程复制文件(免密登录)
    使用 TestNG 并发测试 ;
    maven 添加tomcat依赖
    maven Web项目中POM的配置信息
    找xpath好用的工具(比较少用,针对只能在IE上打开的网站)
    maven 实践 :管理依赖
    maven将依赖打入jar包
    maven scope含义的说明
    Maven编译打包出错:找不到符号
  • 原文地址:https://www.cnblogs.com/dee0912/p/4960651.html
Copyright © 2011-2022 走看看