0

我似乎无法将手风琴菜单应用于使用 jquery 附加的新 html 代码。为了让事情变得更复杂,我使用 ajax 函数和 for 循环从 mysql 服务器中提取数据。当我这样做时,我只能将手风琴菜单应用于第一个标题。

$(document).ready(function(){
    $.ajax({                                      
      url: 'database/api.php', data: "", dataType: 'json',  success: function(rows)        
      {
        for (var i in rows)
        {
          var row = rows[i];          
          var code = row[0];
          var process = row[1];

          $('#accordion').append("<h3>"+code+"</h3><div><p>Process: "+process+"</p></div>");


        } 
      } 
    });
    $("#accordion").accordion({collapsible: true, active: false});
});
4

1 回答 1

1

除非您指定,否则 ajax 请求是异步完成的。这意味着它将启动 ajax 请求并跳到下一条语句,即使它还没有完成。因此,您在附加数据之前初始化手风琴。在 for 循环之后将手风琴语句移动到成功状态。

另外,不要一直将 html 附加到 DOM。将它们全部收集在一个变量中并执行一次。

$(document).ready(function(){
$.ajax({                                      
  url: 'database/api.php', data: "", dataType: 'json',  success: function(rows)        
  {
    var innerHtml = "";//variable to store what you want to add
    for (var i in rows)
    {
      var row = rows[i];          
      var code = row[0];
      var process = row[1];

      innerHtml += "<h3>"+code+"</h3><div><p>Process: "+process+"</p></div>";


    }

    $("#accordion").append(innerHtml).accordion({collapsible: true, active: false});
  } 
});

});
于 2013-06-10T02:27:42.047 回答