我遇到一个问题,在手风琴启动之前,手风琴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);
});
});
答案 0 :(得分: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()
创建手风琴之前已加载手风琴
Literaly你的意思是等到我的.getJSON()
.done()
首先插入.html()
然后执行$.accordion()
。这完全由上面的代码翻译。
答案 1 :(得分:1)
也许您需要在创建手风琴后触发的create
事件 - &gt; http://api.jqueryui.com/accordion/#event-create