使用 ajax 多次请求,并将结果集合并(ajax 非异步)

直接上代码吧... 里面有注释

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
        <script src="js/jquery-3.4.1.js"></script>
    </head>
    <body>
        <script>
            
            (function() {
                var data = {stuId:'4231'};
                var list = [];
                getInfo(function(data,obj){
                    // 第一次查询没有数据或者条数不满足3条数据,进行参数分割
                    if( data ){
                        list.push(data);
                    }else{
                        // 参数分割
                        var stuIds = obj.stuId.split("");
                        // 循环请求获取数据
                        for (var i = 0; i < stuIds.length; i++) {
                            // 参数对象
                            var obj = {stuId: stuIds[i]};
                            //先判断 list 是否的条数 是否满足条件
                            if( list.length >= 2 ){
                                // 中止请求
                                break;
                                //throw Error("满足条件,不再进行请求...");
                            }else{
                                getInfo(function(data){
                                    if( data ){
                                        list.push(data);
                                    }
                                },obj);
                            }
                        }
                    }
                },data);
                
                console.log(list);
            })();
            
            // 回调函数
            function getInfo(callback,stuId) {
                $.ajax({
                    async:false,// 同步请求
                    type: 'get', //请求方式
                    url: 'http://127.0.0.1:8080/stu/findById', //请求服务器地址
                    contentType: "application/json", //设置将要传输内容的编码类型
                    data: stuId, //参数对象
                    success: function(data) { //完成时的事件
                        callback(data,stuId);
                    },
                    error: function(error) { //出现错误时的事件
                        alert("出现异常。");
                    }
                });
            }
        </script>
    </body>
</html>

 

posted @ 2019-09-24 09:20  追梦滴小蜗牛  阅读(919)  评论(0编辑  收藏  举报