zoukankan      html  css  js  c++  java
  • 使用 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>
  • 相关阅读:
    使用Maven快速创建一个SpringMVC工程步骤
    签到
    yaml简介
    APP定位元素之UiSelector
    js中var、let、const区别
    用Jquery去写树结构
    正则相关的知识分享
    python常见问题
    Vue.js 的一些小技巧
    关于jsp删除成功,添加成功等之后 页面自动跳转的js写法
  • 原文地址:https://www.cnblogs.com/oukele/p/11576439.html
Copyright © 2011-2022 走看看