在线等--ajax嵌套ajax 提示数据是undefined

Posted 2023-05-02

需要到A表中获取数据，再作为查询条件访问B表，就用了AJAX嵌套，外部的ajax没有问题，就是内部的执行后跳转到error...提示我的参数为undefined...
第一个ajax

$.ajax(
type:"POST",
url:"preitem.php",
dataType:"json",
data:"user":$user,"pwd":$preTime,
success:function(msg)
var $startime=msg.startTime;
var $finishTime=msg.endTime;
var $step=msg.timeInterval;
var $cars =msg.carNum;
setPre($startime,$finishTime,$step,$cars,$preTime) //调用第二个ajax

)
---第二个ajax

function setPre(var1,var2,var3,var4,var5)
// var $preTime= window.localStorage["prebookDate"];
//如果时间表里没有当天设置， 读取字典表里默认设置

$startTime = var1; //预约开始时间
$endTime = var2; //预约结束事件
$timeInterval = var3; //时间段间隔
$carNum =var4; //每时间段发班车
$pretime=var5; //预约日期
//$user=var6; //预约客户
if(!$perform)
var $str;
var $getStartTime = getTime1($pretime+" "+$startTime);//开始时间转换为时间戳
var $getEndTime = getTime1($pretime+" "+$endTime);//开始时间转换为时间戳

var $getStartTime1; //初始时间
var $addTime=$getStartTime; //计算后时间
while($addTime<$getEndTime)
$getStartTime1=$addTime;
$addTime +=$timeInterval*60*1000;
var $pres=getDate1($getStartTime1,false)+"-"+getDate1($addTime,false);
// alert($pres);
$.ajax(
type:"POST",
url:"11.php",
// async:false,
dataType:"json",
data:"pretime":$pres,"carnum":$carNum,"predate":$pretime,
success:function(msg)
$str="<li><a href='#'><img src='/images/car.png'><h2>"
$str += getDate1($getStartTime1,false)+" 至 "+getDate1($addTime,false)
$str += "</h2><p>"
$str += "已预约5辆车，还可预约5辆"
$str += "</p></a><a href='#pageInfo' data-rel='dialog' data-transition='pop'>预约</a></li>"
$("#ul_parTime").append(function()
return $str;
);
,
error: function(XMLHttpRequest, msg, errorThrown)
// alert(XMLHttpRequest.status);
// alert(XMLHttpRequest.readyState);
alert(msg.carpre);
// alert(textStatus);

)


PHP 11.php ==直接返回参数
<?php
header('Content-type:text/html;charset=utf-8');
$predate =$_POST['predate'];
$carNum =$_POST['carnum'];
$pretime=$_POST['pretime'];
$arr['carpre'] =$carNum;
$arr['remind'] = $pretime;
echo encode_json($arr);
?>

type: "POST",
dataType: "json",
url: proxyUrl,
data: datas,
beforeSend: function () $("#" + P_ProgressBarDivId).show(); ,
complete: function () $("#" + P_ProgressBarDivId).hide(); ,
success: function (msg)
$("#" + P_ShowDataDivId).html("");
$.each(msg.data, function (i, item)
var reval = "";
reval += "<div class=\\"bbsblock\\">";
if (item.Reply_ID != null && item.Reply_ID != "")
var PreReply="";
if(item.PreReply_ID>0)

var Url = SiteAppPath+"Ajax/YXAjax.ashx";
var adatas = "&jsonType=GetReplyCom&ReplyID="+item.PreReply_ID;
$.ajax(
type: "POST",
dataType: "text",
url: Url,
data: adatas,
success:function(msg)
PreReply=msg;
);


reval+=PreReply;
reval+=item.Reply_Content
reval += " </div>";
$("#" + P_ShowDataDivId).append(reval);

);

,
error: function (xhr, ajaxOptions, thrownError)
alert(thrownError);
return;

);


这个写的是一个论坛，有留言回复功能，最外一层ajax是从后台取出所有的留言，最里面一层是获得每层所引用回复，奇怪的是最里面一层ajax虽然执行了，可是最后显示并没有显示出来，在调试的时候，每一层设置一个alert（reval）又能显示出最里面一层，求解这是怎么回事儿，是缓存么？ 参考技术A 错误信息贴详细点啊。 你这样说，不知道到底有什么问题。。 参考技术B 你要用豹纹监控工具看看会来的数据正却不正确啊 参考技术C if(!$perform) perform从哪儿来的 参考技术D 说明什么呢 第5个回答  2015-04-11 看不懂，太高深

ES6之Promise封装ajax()

什么是异步？

　　同步：一定要等任务执行完了，得到结果，才执行下一个任务。

　　异步：不等任务执行完，直接执行下一个任务。

为什么要用promise？

　　Promise的出现主要是解决地狱回调的问题，比如你需要结果需要请求很多个接口，这些接口的参数需要另外那个的接口返回的数据作为依赖，这样就需要我们一层嵌套一层，但是有了Promise 我们就无需嵌套

　　Promise的本质就是分离了异步数据获取和业务逻辑

所有代码

Promise/A+规范

 $.Ajax()中的promise

如果不使用promise,$.ajax请求的时候成功和失败的回调函数是写在参数里的,他是对象参数的一个值

$.ajax({
        method:"post",
        url:"/xxx",
        data:"username=mtt&password=1",
        dataType:‘json‘,
        success:()=>{}//成功后的回调函数
        error:()=>{}//失败后的回调函数
    }
    )

如果使用jQuery.axja()发送请求,并使用promise,代码如下

let myButton = document.getElementById(‘myButton‘);

function success(responseText){
    console.log("成功")
    console.log(responseText);//responseTex
}
function fail(request){
    console.log("失败")
    console.log(request);
}
myButton.addEventListener("click",(e)=>{
    //使用ajax
    $.ajax({
        method:"post",
        url:"/xxx",
        data:"username=mtt&password=1",
        dataType:‘json‘//预期服务器返回的数据类型,如果不写,就是响应里设置的
    }
    ).then(success,fail)//$.ajax()返回一个promise
})

$.ajax()函数会返回一个promise,然后在后面.then(success,fail)时候,如果成功了就会调用第一个参数里的函数即success函数,如果失败了就会调用第二个参数的函数即fail函数.

Promise的优点（1.语法上的简化）：不用记住失败或者成功的函数名字.只需要知道成功是第一个参数,失败时第二个参数,比如：

 

 　　//使用ajax
    $.ajax({
        method:"post",
        url:"/xxx",
        data:"username=mtt&password=1",
        dataType:‘json‘//预期服务器返回的数据类型,如果不写,就是响应里设置的
    }
    ).then((responseText)=>{console.log(responseText)},()=>{console.log("失败")})//$.ajax()返回一个promise, 

 

Promise的优点（2.多次处理）： .then(()=>{},()=>{})

$.ajax({
        method:"post",
        url:"/xxx",
        data:"username=mtt&password=1",
        dataType:‘json‘//预期服务器返回的数据类型,如果不写,就是响应里设置的
    }
    ).then((responseText)=>{
        console.log(responseText)
        return responseText;//如果要对结果进行多次处理,就在这里return,第二次then就会得到这个return的数据
    },()=>{
        console.log("失败")
    }).then(//开始第二次then
        (上一次return的结果)=>{
            console.log("第二次处理")
            console.log(上一次return的结果)
        },
        ()=>{
            //第二次处理失败结果
        }
    )

封装一个类似$.Ajax()中的Promise的简易版本

let ajax=function(url, param, type = ‘POST‘){
    　　return new Promise(function(resolve, reject){
        $.ajax({
            type: type,
            url: url,
            data: param,
            dataType: ‘json‘,
            success(res) {
                resolve(res)
            },
            error(res) {
                reject(‘响应错误‘)
                // reject(res.statusText)
            }
        })
    })
    
}

// 使用示例
ajax(‘http://wh.xhd.cn/api/content/list.jspx‘,{channelIds: 1}).then(res=>{
    console.log(res)
})

///其他

//封装ajax

window.jQuery.ajax = ({method,path,body,headers})=>{//ES6语法
   //进行Promise封装
    return new Promise((resolve,reject)=>{//这句话是套路,记住
        let request = new XMLHttpRequest();
        request.open(method,path);//配置

        for (const key in headers) {//遍历header,设置响应头
            let value = headers[key];
            request.setRequestHeader(key,value);
        }
        request.send(body);//发送,并配置响应体

        request.onreadystatechange = ()=>{
            if(request.readyState ===4){
                if ( request.status>=200&&request.status<=400){
                    resolve.call(undefined,request.responseText);//执行成功函数
                }else if(request.status>=400){
                    reject.call(undefined,request);//执行失败函数
                }
            }
        }
    })
}

//调用
myButton.addEventListener("click",(e)=>{
    //使用ajax
    $.ajax({
        method:"post",
        path:"/xxx",
        body:"username=mtt&password=1",
        headers:{
            "content-type":‘application/x-www-form-urlencoded‘,
            "mataotao":18
        }
    }).then(
        (responseText)=>{console.log(responseText);},//成功就调用这个函数
        (request)=>{console.log(request);}//失败就调用这个函数
    )
})

 

第一个要记住的:这个Promise必须接收一个函数,函数里面就是要做的事情(即发送请求,Ajax请求),一般来说,把所有东西放在里面,第一句就是return.然后要做的事情放在里面.

第二个要记住的:Promise接收的这个函数有两个参数,一个叫做resolve.一个叫reject 前两个要记住的写出来就是

return new Promise((resolve, reject) => {
        //要做的事
    });

第三个要记住的:如果成功了就调一下resolve(),如果失败了就调用reject(),所以Ajax()参数中不需要successFn和failFn了 并且将成功行和失败行对应的代码分别改为 resolve.call(undefined,request.responseText);//执行成功函数和reject.call(undefined,request);//执行失败函数

上面是固定的套路

 

背下这个方法！！

function xxx(){
    return new Promise((f1, f2) => {
        doSomething()
        setTimeout(()=>{
            // 成功就调用 f1，失败就调用 f2
        },3000)
    })
}

xxx().then(success, fail)

// 链式操作
xxx().then(success, fail).then(success, fail)