如何使用jquery将json数据的每个id从一个ajax调用传递到另一个ajax调用

我想从food2fork api获取数据，在这两个api中，有两个api用于获取数据。一个用于配方搜索，另一个用于配料详细信息。我正在尝试获取每个id并将其传递给另一个ajax调用。到目前为止，我的代码如下所示：

http://food2fork.com/api/search?key=7508d614a766c7768131b60ef99a3f52&q=pizza
http://food2fork.com/api/get?key=7508d614a766c7768131b60ef99a3f52&rId=35128

JavaScript:

$(document).ready(function() {
    var id, b, c, temp;
    $("#button1").click(function() {
        var food = $("#food").val();
        $.ajax({
            type: 'POST',
            url: "https://mindapp-pulpy.rhcloud.com/AuthXmlPulpy",
            data: {
                appid: 'MPAPP_1060',
                p1: food
            },
            //global:false,
            //async:false,
            dataType: "xml",
            success: function(data) {
                $("#display1").hide();
                $(data).find("root").each(function() {
                    id = $(this).find("rid").text(); //recipe-id
                    b = $(this).find("img").text(); //image-url
                    c = $(this).find("title").text(); //title
                    console.log(id);
                    $("#disimg").append('<div class="col-md-4"><div class="panel panel-info"><div class="panel-heading myshow"><strong>' + c + '</strong></div><div class="panel-body"><img class= "img-responsive thumbnail" src="' + b + '" style="height:150px;width:200px;"><button type="button" class="btn btn-primary btn-sm mine"><span class="glyphicon glyphicon-arrow-right"></span> Details..</button></div></div></div>');

                    $('.myshow').on('click', +c, function(event) {
                        if (event.handled !== true) {
                            listObject.itemID = id;
                            var currentID = listObject.itemID;
                            window.sessionStorage.setItem('parentId', currentID);
                            console.log(currentID + 'recipeid');
                            event.handled = true;
                            return false;
                        }
                    });
                });
            }, //success
            beforeSend: function() {
                // Code to display spinner
                $("#disimg").empty();
                $(".loader").show();
            },
            complete: function() {
                // Code to hide spinner.
                $(".loader").hide();
            },
            error: function(request, error) {
                $("#display1").hide();
                $("#mydisplay").html('<center><h1> OOPS! </strong> Network error, Data not found..</center></h1>');
            }
        }); //ajax ends
        var parentId = sessionStorage.getItem('parentId');
        $.ajax({
            type: "POST",
            url: "https://mindapp-pulpy.rhcloud.com/AuthXmlPulpy",
            data: {
                appid: 'MPAPP_1065',
                p1: parentId
            },
            dataType: "xml",
            success: function(xml) {
                xmlParser(xml);
            }
        });

        function xmlParser(xml) {
            //var parentId=sessionStorage.getItem('parentId');
            $(xml).find("root").each(function() {
                var d = $(this).find("recid").text();
                var desc = $(this).find("indg").text();
                console.log(desc);
                //$("#details").append('desc:'+ desc +'<br>');
            });
        }
    });
}); //document

$（文档）.ready（函数（）{
变量id、b、c、温度；
$（“#按钮1”）。单击（函数（）{
var food=$（“#food”）.val（）；
$.ajax({
键入：“POST”，
url:“https://mindapp-pulpy.rhcloud.com/AuthXmlPulpy",
数据：{
appid:'mpapp1060'，
p1：食物
},
//全球：错，
//async:false，
数据类型：“xml”，
成功：功能（数据）{
$（“#display1”）.hide（）；
$（数据）。查找（“根”）。每个（函数（）{
id=$（this.find（“rid”）.text（）；//配方id
b=$（this.find（“img”）.text（）；//图像url
c=$（this.find（“title”）.text（）；//title
console.log（id）；
$（“#disimg”）.append（“”+c+”详细信息…）；
$（'.myshow'）。on（'click'，+c，函数（事件）{
if（event.handled！==true）{
listObject.itemID=id；
var currentID=listObject.itemID；
window.sessionStorage.setItem（'parentId'，currentID）；
log（currentID+'recipeid'）；
event.handled=true；
返回false；
}
});
});
}，//成功
beforeSend:function（）{
//显示微调器的代码
$（“#disimg”）.empty（）；
$（“.loader”）.show（）；
},
完成：函数（）{
//隐藏微调器的代码。
$（“.loader”）.hide（）；
},
错误：函数（请求、错误）{
$（“#display1”）.hide（）；
$（“#mydisplay”）.html（'OOPS！网络错误，找不到数据..'）；
}
})；//ajax结束
var parentId=sessionStorage.getItem（'parentId'）；
$.ajax({
类型：“POST”，
url:“https://mindapp-pulpy.rhcloud.com/AuthXmlPulpy",
数据：{
appid:'mpapp1065'，
p1：父ID
},
数据类型：“xml”，
成功：函数（xml）{
xmlParser（xml）；
}
});
函数xmlParser（xml）{
//var parentId=sessionStorage.getItem（'parentId'）；
$（xml）.find（“root”）.each（function（）{
var d=$（this.find（“recid”）.text（）；
var desc=$（this.find（“indg”）.text（）；
控制台日志（desc）；
//$（“#详细信息”）.append（'desc:'+desc+'
'）；
});
}
});
}); //文件

---

只需要最后一个

配方id

，我哪里出错了？你能帮我一下吗这是因为闭包的行为

像这样将内部处理程序包装到另一个闭包中可以解决问题

(function (id) {
    $('.myshow').on('click', +c, function (event) {
        if (event.handled !== true) {
            listObject.itemID = id;
            var currentID = listObject.itemID;
            window.sessionStorage.setItem('parentId', currentID);
            console.log(currentID + 'recipeid');
            event.handled = true;
            return false;
        }
    });
})(id);

看这张照片

在您的情况下，点击处理程序将在稍后的时间点执行，此时

id

的值将是

每个

循环的最后一个元素

---

soultin可以工作，因为它创建了另一个私有clousure，并且每个clousure都有单独的

id

值。

请格式化您的文件，使其可读（包括适当的缩进）。如果您希望其他人查看您的代码，您至少可以这样做。我已经按照上面的代码片段进行了更改，id问题现在已经解决了，那么我如何将每个id分配给parentId变量以传递第二个api（例如，var parentId=sessionStorage.getItem（'id'）；），我可以将id放在其中。