我需要制作多个getJSON
请求将数据写入 HTML 文件。此示例显示了 3 个请求,但我将以相同的格式添加最多 6 个请求(可能更多)。
我的问题是结果以随机顺序返回,而不是按调用顺序返回。我怀疑它们是按照请求完成的顺序返回的。
我每次都必须以相同的顺序编写 div。
这些值是从返回的getJSON
请求加上每个请求的情况下的两个实例来自一组本地变量(nwsltrID[0]
and nwsltrNames[0]
每个请求都是唯一的。因此,由于这两个变量(代码示例中所示),我附加的 HTML 变得可变。
代码示例:
$.getJSON(url0, function (data) {
utcday = data[0].createdOn;
ltrDay = moment.utc(utcday).format("DD MMM YY");
$('#listDiv').append("<div class= \"ellipsis\" ><div class=\"ltrFolder\" ><a title= \"Archive\" href = \"" + idString3 + nwsltrID[0] + "\"><i class=\"fa fa-folder-o\"></a></i></div><div id=\"" + data[0].id + "\"class= \"ellipsis listTitle\" >" + nwsltrNames[0] + "<br><a title= \"" + data[0].conversation + "\" class = \"addressClick\" id =\"" + url0 + "\"><span class =\"point\" ><i class=\"fa fa-newspaper-o\"></i></span>" + data[0].conversation + "</a><div class=\"ltgrey\" style=\"text-transform:uppercase;padding-top:3px;\">" + ltrDay + "</div></div><div style=\"padding: 0 20px 20px 0; color:#666666;\">" + data[0].textHead + "</div>");
});
$.getJSON(url1, function (data) {
utcday = data[0].createdOn;
ltrDay = moment.utc(utcday).format("DD MMM YY");
$('#listDiv').append("<div class= \"ellipsis\" ><div class=\"ltrFolder\" ><a title= \"Archive\" href = \"" + idString3 + nwsltrID[1] + "\"><i class=\"fa fa-folder-o\"></a></i></div><div id=\"" + data[0].id + "\"class= \"ellipsis listTitle\" >" + nwsltrNames[1] + "<br><a title= \"" + data[0].conversation + "\" class = \"addressClick\" id =\"" + url1 + "\"><span class =\"point\" ><i class=\"fa fa-newspaper-o\"></i></span>" + data[0].conversation + "</a><div class=\"ltgrey\" style=\"text-transform:uppercase;padding-top:3px;\">" + ltrDay + "</div></div><div style=\"padding: 0 20px 20px 0; color:#666666;\">" + data[0].textHead + "</div>");
});
$.getJSON(url2, function (data) {
utcday = data[0].createdOn;
ltrDay = moment.utc(utcday).format("DD MMM YY");
$('#listDiv').append("<div class= \"ellipsis\" ><div class=\"ltrFolder\" ><a title= \"Archive\" href = \"" + idString3 + nwsltrID[2] + "\"><i class=\"fa fa-folder-o\"></a></i></div><div id=\"" + data[0].id + "\"class= \"ellipsis listTitle\" >" + nwsltrNames[2] + "<br><a title= \"" + data[0].conversation + "\" class = \"addressClick\" id =\"" + url2 + "\"><span class =\"point\" ><i class=\"fa fa-newspaper-o\"></i></span>" + data[0].conversation + "</a><div class=\"ltgrey\" style=\"text-transform:uppercase;padding-top:3px;\">" + ltrDay + "</div></div><div style=\"padding: 0 20px 20px 0; color:#666666;\">" + data[0].textHead + "</div>");
});
我确信我在这里做了一些其他可以改进和优化的新手事情。
所以,我渴望听到所有的建议。
我希望我已经提供了足够的信息来解决这个问题。
要订购 AJAX 查询,您可以使用$.when功能 -http://api.jquery.com/jquery.when/:
这是给您的示例:
$.when( $.getJSON(url0), $.getJSON(url1), $.getJSON(url2) ).done( function() {
$.each(arguments, function(index, result) {
var data = result[0];
utcday = data[0].createdOn;
ltrDay = moment.utc(utcday).format("DD MMM YY");
$('#listDiv').append(... + nwsltrID[index] + .... + nwsltrNames[index] + ... );
});
});
无论您有多少查询 - 只需将其添加为 $.when 函数的参数即可!
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)