1

我遇到了一个问题，即在启动手风琴之前，首先使用 .html() 将手风琴 html 注入到标签上，从而使注入的 html 看起来像普通的 html。

这是我在脚本中的代码：

$(function() {

$( "#accordion1" ).accordion({
          heightStyle: "content",
          collapsible: true,
          active:false,
          activate:"refresh",
          animate:false
    });

$.getJSON( 'http://localhost/media_books/index.php/new_books.json?provider_id=1&limit=99&offset=1')
    .done(function( json ) {    
        var html = '<div id="accordion1" style="font-size:smaller;" class = "accordion">';
        for ( var obj in json.data) {
            var att = json.data[obj].attributes;
            html += '<h3>' + att.title + '</h3>';
            html += '<div >';

            html += "<p>" + att.author + "</p>";
            html += '</div>';
        }
        html += '</div>';
        $("#tabs_1").html(html);
});
});
4

2 回答 2

2

把它放在你的.done()

$(function() {


    $.getJSON( 'http://localhost/media_books/index.php/new_books.json?provider_id=1&limit=99&offset=1')
        .done(function( json ) {    
            var html = '<div id="accordion1" style="font-size:smaller;" class = "accordion">';
            for ( var obj in json.data) {
                var att = json.data[obj].attributes;
                html += '<h3>' + att.title + '</h3>';
                html += '<div >';

                html += "<p>" + att.author + "</p>";
                html += '</div>';
            }
            html += '</div>';
            $("#tabs_1").html(html);
            $( "#accordion1" ).accordion({
              heightStyle: "content",
              collapsible: true,
              active:false,
              activate:"refresh",
              animate:false
            });
    });

});

为什么在这里？ 因为 ：

如何在使用 .html() 创建手风琴之前确保已加载手风琴

.getJSON()从字面上看，你的意思是等到我.done()先插入.html() 然后再做$.accordion(). 上面的代码完全翻译了它。

于 2013-06-24T10:39:25.583 回答
1

也许您需要在create创建手风琴后触发的事件 --> http://api.jqueryui.com/accordion/#event-create

于 2013-06-24T10:35:50.607 回答