如何使用onclick处理程序在jQuery UI中添加选项卡？

Question

我正在尝试将标签信息附加到现有的jQuery UI标签容器，然后重新初始化标签容器以更新内容。

以下是我正在尝试做的简单的JSFiddle：http://jsfiddle.net/dmchale92/Wa69N/

这是我用来附加基本测试段落的函数：

$(function () {
a = "<div id='tabs-4'><p>This is a test paragraph.</p></div>"
b = "<li><a href='#tabs-4'>Blog Four</a></li>"
$("#tabs").append(a);
$("#tablist").append(b);
$("#tabs").tabs();
});

有人可以向我解释为什么新标签标题不保留其他标签的样式，以及为什么将内容添加到容器外部的底部而不是分页？

Answer 1

您需要刷新它：DOC

DEMO

$("#tabs").tabs( "refresh" );

Answer 2

你需要这样做

$(function () {
$('#tabs').tabs("destroy");
a = "<div id='tabs-4'><p>This is a test paragraph.</p></div>"
b = "<li><a href='#tabs-4'>Blog Four</a></li>"
$("#tabs").append(a);
$("#tablist").append(b);
$("#tabs").tabs();
});

http://jsfiddle.net/farrukhsubhani/Wa69N/2/