関数による複数の ajax リクエスト呼び出しでマークアップ変数の設定に問題があります。関数の数はわかりませんが、この例では 2 つ作成し、同じ js ファイルに入れます。不明な数の関数をループして、応答にマークアップ変数を追加しようとしています。
ただし、関数が終了する前に ajax リクエストは終了しません。続行する前に ajax からの応答を確認するにはどうすればよいですか?
getMarkup() は document.ready で実行されます
function getMarkup(){
var news = [];
news.push('loadnews1');
news.push('loadnews2');
len = news.length;
var markup;
for(i=0; i<len; i++){
try{
markup = eval(news[i] + '();');
}catch(ex){
}
}
console.log(markup);
}
function loadnews1(){
var host = 'http://test.com';
var path = '/ajax-feeds/news/json1';
var markup = "";
$.ajax({
url: host + path,
dataType: "json",
async: true,
success: function(data) {
$.each( data, function( key, value ) {
markup += '<div id="new-row-'+key+'" class="news-row">' +
'<div class="news-row-spotlight-image"><img src="'+value.picture+'"></div>' +
'<div class="news-row-spotlight-title">'+value.title+'</div>' +
'<div class="news-row-title">'+value.subtitle+'</div>' +
'<div class="news-row-spotlight-teaser">'+value.body+'</div>' +
'<div class="news-row-spotlight-link"><a href="http://test.com/'+value.nid+'">More Link</a></div></div>';
});
return markup;
}
});
}
function loadnews2(){
var host = 'http://test.com';
var path = '/ajax-feeds/news/json2';
var markup = "";
$.ajax({
url: host + path,
dataType: "json",
async: true,
success: function(data) {
$.each( data, function( key, value ) {
markup += '<div id="new-row-'+key+'" class="news-row">' +
'<div class="news-row-spotlight-image"><img src="'+value.picture+'"></div>' +
'<div class="news-row-spotlight-title">'+value.title+'</div>' +
'<div class="news-row-title">'+value.subtitle+'</div>' +
'<div class="news-row-spotlight-teaser">'+value.body+'</div>' +
'<div class="news-row-spotlight-link"><a href="http://test.com/'+value.nid+'">More Link</a></div></div>';
});
return markup;
}
});
}