zoukankan      html  css  js  c++  java
  • Ajax 同步异步互相转换以及区别

    Ajax同步异步的区别:

    xmlHttp.open(method,url,async);

    async:布尔值,用来说明请求是否为异步模式。是来控制JavaScript如何执行该请求。

    异步请求:当async设置为true时,将以异步模式发送请求,JavaScript代码将继续执行而不再等待响应,且必须使用一个事件处理函数来监控请求的响应。

    同步请求:当async设置为false时,将以异步模式发送请求,JavaScript将等接收到响应后再继续执行剩余代码。这意味着如果响应时间长,用户在浏览器收到响应前是无法与其交互的。

    因此,Ajax开发建议是:使用异步请求来实现数据获取,使用同步请求来实现与服务器之间发送和接收简单的消息。

    用同步模式来发送请求(将open()方法的第三个参数设置为false),可以使你在调用send()方法之后马上对其响应进行处理。

    这对于想让用户交互等待响应,或希望只接受很少的数据(例如,小于1kb)的应用场景是很有用的。

    而对于通常数据量或者较大的数据量而言,最好是使用异步调用

    Ajax例子:

    <!DOCTYPE html>
    <html>
    
        <head>
            <meta charset="UTF-8">
            <title>Ajax同步异步转换</title>
            <script type="text/javascript" src="js/jquery.min.js"></script>
        </head>
    
        <body>
    
            <script>
                //在post/get提交方式的简写:
                $.post/get("url",{data},function(response){});
                //默认是异步的!
    
                $.ajax(
                    type: "POST/GET",
                    url: "",
                    data: {},
                    dataType: "json",
                    async: true / false,
                    success: function(date) {
    
                    }
                );
                //success是之前的写法,现在推荐用.dane()
    
                //这是最常见的使用ajax方法了。下面实现ajax的同步请求:
                $.ajax(
                    type: "POST/GET",
                    data: {},
                    async: false,
                ).done(function(date) {
    
                });
                //ajax同步请求最常见的就实现ajax请求的结果数据返回。 
                //比如在用ajax方法成功得到相应后,我们需要把ajax的返回结果return出去给外部的函数使用这时需要同步。
                function ajax() {
                    var backData;
                    $.ajax(
                        type: ”post”,
                        data: {},
                        async: false, //更改为同步 
                    ).done(
                        function(response) {
                            backData = response;
                        });
                    return backData;
                }
                var newData = ajax();
                //此时newData = response;
                //在此过程中注意修改async, 它如果是true( 默认), 
                //那么就是在异步的情况下, 这种情况下实现return是不能实现的, 因为异步就说明了程序的执行顺序和效果发生了改变。 修改为同步, 实现返回值。
                
                //举例ajax异步转同步
                //添加新用户
                function ajaxNew(username){
                    var username;
                    var newVal;//添加以后新用户的信息
                    $.ajaxSetup({ //ajax异步转同步
                        async : false
                    });   
                
                    $.get("./ajaxAdmin.php?use="+username+"&new=1",
                        function(data,status){
                            // alert("内容:"+data+"
    状态: "+status);
                            //存储信息
                            newVal=data;
                        });
                    return newVal;
                    alert(newVal);
                }
    
                
            </script>
        </body>
    
    </html>

      

  • 相关阅读:
    Codechef EDGEST 树套树 树状数组 线段树 LCA 卡常
    BZOJ4319 cerc2008 Suffix reconstruction 字符串 SA
    Codechef STMINCUT S-T Mincut (CodeChef May Challenge 2018) kruskal
    Codeforces 316G3 Good Substrings 字符串 SAM
    Codechef CHSIGN Change the Signs(May Challenge 2018) 动态规划
    BZOJ1396 识别子串 字符串 SAM 线段树
    CodeForces 516C Drazil and Park 线段树
    CodeForces 516B Drazil and Tiles 其他
    CodeForces 516A Drazil and Factorial 动态规划
    SPOJ LCS2
  • 原文地址:https://www.cnblogs.com/alizhi/p/9179122.html
Copyright © 2011-2022 走看看