我正在使用 jquery ui 选项卡动态创建动态选项卡,该选项卡将在没有任何内容的情况下开始。据我所知,我的代码正在构建所有内容并将其放在适当的位置,但 jquery 没有将它们识别为选项卡。我如何让它识别页面加载后创建的新标签?
html代码:
<div class="main">
<div>
<button id="new">button</button>
</div>
<div id="tabs">
<ul>
<li><a href="#tabs-1">View1</a></li>
<li><a href="#tabs-2">View2</a></li>
<li id="createView"><a href="null">Create New</a></li>
</ul>
<div id="tabs-1">
<p>something on this page</p>
</div>
<div id="tabs-2">
<div>
<p>something else on this page</p>
</div>
</div>
</div>
</div>
Javascript:
//Tabs functionality
$('#tabs').tabs();
//Create new view
var tabNum = 3;
$('#new').click(function() {
$('#tabs ul').append('<li>' + '<a href="' + '#tabs-' + tabNum + '">' + 'newitem' + '</a>' + '</li>');
$('#tabs').append('<div id="' + 'tabs-' + tabNum + '">' + '<div>new</div>' + '</div>');
var NewViewNum = 'tabs-' + tabNum;
$(NewViewNum).focus();
tabNum++;
});