Javascript $.ajax Get数据不附加到var

输出有一个问题：我想用来自ajaxcall的一些数据填充输出。 调用成功（每个调用中的输出都充满了数据） 但是，内部的输出与外部的输出不一致。 我总是说“

而不是

  <ul id="listname" data-inset=true><li>some data</li></ul>

某些数据

$（“div:jqmData（role='collapsable'）”）。每个（function（）{
var id=$（this.data（“id”）；
var idDate=id.slice（7,18）；
var listapp=“id\u col”+idDate；
var listname=“id\u col”+idDate；
输出='
；
$.ajax({
url:'lomodata.php'，
数据：“时间戳=”+idDate，
键入：“GET”，
ContentType:“应用程序/json”，
数据类型：“json”，
成功：功能（res）{
如果（res！=''）
{
$.each（res，function（i，Object）{
输出+='
'+Object.reg+'
'；
控制台日志（输出）；
}); 
}
}
});
输出+='
'；
$（this.append（output.trigger）（“create”）；
$（this.listview（）；
$（this.listview（'refresh'）；
});

注意，

$.ajax

默认情况下是异步的，当您到达

$（this.append（output）

）时，

输出还没有定义，因为
.ajax（）
调用尚未完成。您需要将
append
移动到
success
处理程序中，或添加
async:false
选项，以便
$。ajax
成为阻塞调用（尽管这违背了使用
ajax
的目的）：

成功：功能（res）{
如果（res！=''）{
变量输出='
；
$.each（res，function（i，Object）{
输出+='
'+Object.reg+'
'；
控制台日志（输出）；
});
输出+='
'；
$（this.append（output.trigger）（“create”）；
}
}
AJAX是异步的。当您编写
$.AJAX（…）
，一个HTTP请求将被发送到服务器，然后服务器将继续执行下一个操作，
output+='。
。此时HTTP请求尚未完成，因此在您将
output
附加到文档时，您的回调尚未执行。
$（“div:jqmData（role='collapsable'））。每个（功能（）{
$("div:jqmData(role='collapsible')").each(function () {
  var el = this;
  var id = $(this).data("id");
  var idDate = id.slice(7, 18);
  var listapp = "id_col_" + idDate;
  var listname = "id_col_" + idDate;

  $.ajax({
    url: 'lomodata.php',
    data: 'timestamp=' + idDate,
    type: 'GET',
    ContentType: "application/json",
    dataType: "json",
    success: function (res) {
      output = '<ul id="listname" data-inset=true>';

      if (res != '') {
        $.each(res, function (i, Object) {
          output += '<li>' + Object.reg + '</li>';
          console.log(output);
        });
      }

      output += '</ul>';

      el.append(output).trigger("create");
      el.listview();
      el.listview('refresh');
    }

  });
});

var el=这个；
var id=$（this.data（“id”）；
var idDate=id.slice（7,18）；
var listapp=“id\u col”+idDate；
var listname=“id\u col”+idDate；
$.ajax({
url:'lomodata.php'，
数据：“时间戳=”+idDate，
键入：“GET”，
ContentType:“应用程序/json”，
数据类型：“json”，
成功：功能（res）{
输出='
；
如果（res！=''）{
$.each（res，function（i，Object）{
输出+='
'+Object.reg+'
'；
控制台日志（输出）；
});
}
输出+='
'；
el.append（output）.trigger（“创建”）；
el.listview（）；
el.列表视图（“刷新”）；
}
});
});
如果将所有使用
output
变量的代码行移动到ajax调用的success函数中，您将看到它是有效的。问题是您错误地使用了异步性

大概是这样的：

$.ajax({
 url: 'lomodata.php',
 data: 'timestamp=' + idDate,
 type: 'GET',
 ContentType: "application/json",
 dataType: "json",
 success: function (res) {
   if (res != '') {
    var output = '<ul id="listname" data-inset=true>';
    $.each(res, function (i, Object) {
       output += '<li>' + Object.reg + '</li>';
     });
    output += '</ul>';

    console.log(output);

    $("#myObject").append(output).trigger("create");
    $("#myObject").listview();
    $("#myObject").listview('refresh');
  }
}

$.ajax({
url:'lomodata.php'，
数据：“时间戳=”+idDate，
键入：“GET”，
ContentType:“应用程序/json”，
数据类型：“json”，
成功：功能（res）{
如果（res！=''）{
变量输出='
；
$.each（res，function（i，Object）{
输出+='
'+Object.reg+'
'；
});
输出+='
'；
控制台日志（输出）；
$（“#myObject”）.append（output.trigger（“create”）；
$（“#myObject”）.listview（）；
$（“#myObject”）.listview（“刷新”）；
}
}

})；
输出（ul）必须在ajax调用之前，因为我不想要入口的子列表
success: function(res) {
  if (res !='') {
    var output='<ul id="listname" data-inset=true>';
    $.each(res, function(i, Object) {
      output+='<li>'+Object.reg+'</li>';
      console.log(output);
    });
    output+='</ul>';
    $(this).append(output).trigger("create");
  }
}

$("div:jqmData(role='collapsible')").each(function () {
  var el = this;
  var id = $(this).data("id");
  var idDate = id.slice(7, 18);
  var listapp = "id_col_" + idDate;
  var listname = "id_col_" + idDate;

  $.ajax({
    url: 'lomodata.php',
    data: 'timestamp=' + idDate,
    type: 'GET',
    ContentType: "application/json",
    dataType: "json",
    success: function (res) {
      output = '<ul id="listname" data-inset=true>';

      if (res != '') {
        $.each(res, function (i, Object) {
          output += '<li>' + Object.reg + '</li>';
          console.log(output);
        });
      }

      output += '</ul>';

      el.append(output).trigger("create");
      el.listview();
      el.listview('refresh');
    }

  });
});

$.ajax({
 url: 'lomodata.php',
 data: 'timestamp=' + idDate,
 type: 'GET',
 ContentType: "application/json",
 dataType: "json",
 success: function (res) {
   if (res != '') {
    var output = '<ul id="listname" data-inset=true>';
    $.each(res, function (i, Object) {
       output += '<li>' + Object.reg + '</li>';
     });
    output += '</ul>';

    console.log(output);

    $("#myObject").append(output).trigger("create");
    $("#myObject").listview();
    $("#myObject").listview('refresh');
  }
}