Jquery ui 使用jquery动态添加时选项卡不工作
我正在使用现有的jquery UI选项卡Jquery ui 使用jquery动态添加时选项卡不工作,jquery-ui,html-lists,jquery-ui-tabs,jquery-append,Jquery Ui,Html Lists,Jquery Ui Tabs,Jquery Append,我正在使用现有的jquery UI选项卡 <div id="tabs"> <ul> <li><a href="#tabs-1">title 1</a></li> <li><a href="#tabs-2">title 2</a></li> <li><a href="#tabs-3">title 3
<div id="tabs">
<ul>
<li><a href="#tabs-1">title 1</a></li>
<li><a href="#tabs-2">title 2</a></li>
<li><a href="#tabs-3">title 3</a></li>
</ul>
<div id="tabs-1">
<p>t1 content</p>
</div>
<div id="tabs-2">
<p>t2 content</p>
</div>
<div id="tabs-3">
<p>t3 content</p>
</div>
</div>
when rendered in the browser, jquery adds some set of classes to the <li> elements. [some part of it given below]
<ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all" role="tablist">
<li class="ui-state-default ui-corner-top ui-tabs-active ui-state-active" role="tab" tabindex="0" aria-controls="tabs-1" aria-labelledby="ui-id-1" aria-selected="true" aria-expanded="true">
<li class="ui-state-default ui-corner-top" role="tab" tabindex="-1" aria-controls="tabs-2" aria-labelledby="ui-id-2" aria-selected="false" aria-expanded="false">
<li class="ui-state-default ui-corner-top" role="tab" tabindex="-1" aria-controls="tabs-3" aria-labelledby="ui-id-3" aria-selected="false" aria-expanded="false">
</ul>
when I append some <li> elements in <ul> using the following jquery code:
$('#tabs ul').append($('<li><a href="#tabs-4">title 4</a></li>');
t1含量
t2含量
t3含量
在浏览器中呈现时,jquery会向元素添加一些类集。[下文给出了部分内容]
-
-
-
当我使用以下jquery代码在中附加一些- 元素时:
$('#tabs ul')。追加($('
');
列表会被追加,但类不会被添加到列表中,因此不会显示选项卡功能
请对此进行深入了解。您还需要添加带有选项卡id的div:
var num_tabs = $('div#tabs ul li.tab').length + 1;
$('div#tabs ul').append(
'<li class="tab"><a href="#tab-' + num_tabs + '">Section ' + num_tabs + '</a></li>');
$('div#tabs').append(
'<div id="tab-' + num_tabs + '"></div>');
没有。它不起作用!实际上我有一个按钮Add Tab…和下面的jquery函数…$(文档)。在('click','#buttonnid',函数(){$('#tabs ul')。append($('li>Add me);$('div#tabs”)。tabs(“refresh”);});谢谢!它起作用了。我使用了load()添加选项卡,但我无法在回调方法中刷新它们。太棒了!我缺少的是“刷新”。谢谢@Italhouarne!@AmiSchreiber我的荣幸!
$("div#tabs").tabs("refresh");