我们正在尝试将内容div
置于jQuery UI ajax标签之上。
ajax的jQuery UI会自动创建div
,ID为ui-tabs-1
,ui-tabs-2
等。并将div
放在UI标签列表下方。我想将通过ajax获取的内容放在标签上方。
脚本 -
<script>
$(function() {
$( "#tabs" ).tabs({
beforeLoad: function( event, ui ) {
ui.jqXHR.error(function() {
ui.panel.html(
"Couldn't load this tab. We'll try to fix this as soon as possible. " +
"If this wouldn't be a demo." );
});
}
});
});
</script>
HTML -
<div id="content"></div> <!-- i would like the content to be displayed here-->
<div id="tabs">
<ul>
<li><a href="content1.html">Tab 1</a></li>
<li><a href="content2.html">Tab 2</a></li>
<li><a href="content3-slow.php">Tab 3 (slow)</a></li>
<li><a href="content4-broken.php">Tab 4 (broken)</a></li>
</ul>
</div>
我该怎么办?
答案 0 :(得分:0)
创建像
这样的div<div id="content">
<div id="uitabs-1">
</div> <!-- i would like the content to be displayed here-->
<div id="tabs">
<ul>
<li><a href="content1.html">Tab 1</a></li>
<li><a href="content2.html">Tab 2</a></li>
<li><a href="content3-slow.php">Tab 3 (slow)</a></li>
<li><a href="content4-broken.php">Tab 4 (broken)</a></li>
</ul>
</div>
答案 1 :(得分:0)
使用jquery UI标签的create
事件:
$("#tabs").tabs({
create: function (event, ui) {
$('.ui-tabs-panel').prependTo('.ui-tabs-nav');
}
});