2009-09-16 116 views
2

以下是演示問題的完整示例腳本,內部標籤公司/部門以列表形式出現而不是製表符。無法獲取嵌套的jquery標籤

編輯: 我已經嘗試過的人都認爲這是什麼內標籤也應通過jQuery可以tabified但

代碼:

<html> 
<head> 
<link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css" rel="stylesheet" /> 
<script type="text/javascript" src="http://jqueryui.com/latest/jquery-1.3.2.js"></script> 
<script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.core.js"></script> 
<script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.tabs.js"></script> 
<script type="text/javascript"> 
$(function(){ 
    //make tabs tabs 
    $('#top-tabs').tabs({selected: 2}); 
}); 
</script> 

</head><body> 

<div id="top-tabs"> 
    <ul> 
      <li><a href="/timeapp/home">Home</a></li> 
      <li><a href="/timeapp/timecard">Timecard</a></li> 
      <li><a href="#tab-selected">Config</a></li> 
    </ul> 

    <div id="tab-selected"> 
    <ul> 
       <li><a href="#inner-tab-selected">Company</a></li> 
       <li><a href="/timeapp/config/department">Department</a></li> 
    </ul> 
    <div id="inner-tab-selected">ok this is a company</div> 

    </div> 
</div> 

</body></html> 

回答

1

我在jQuery論壇發佈了問題,並且got the answer

原因是應該在所有內部標籤上調用elem.tabs(),我給出的例子是通過使用jQuery選擇器來實現的,例如, $('#container ul').tabs(),所以這裏是修改的工作腳本:

<html> 
<head> 
<link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css" rel="stylesheet" /> 
<script type="text/javascript" src="http://jqueryui.com/latest/jquery-1.3.2.js"></script> 
<script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.core.js"></script> 
<script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.tabs.js"></script> 
<script type="text/javascript"> 
$(function(){ 
    //make tabs tabs 
    $('#top-tabs').tabs({selected: 2}); 
    $('#low-tabs').tabs({selected: 1}); 
}); 
</script> 

</head><body> 

<div id="top-tabs"> 
    <ul> 
      <li><a href="/timeapp/home">Home</a></li> 
      <li><a href="/timeapp/timecard">Timecard</a></li> 
      <li><a href="#tab-selected">Config</a></li> 
    </ul> 

    <div id="tab-selected"> 
    <div id="low-tabs"> 
    <ul> 
       <li><a href="#inner-tab-selected">Company</a></li> 
       <li><a href="/timeapp/config/department">Department</a></li> 
    </ul> 
    <div id="inner-tab-selected">ok this is a company</div> 
    </div> 
    </div> 
</div> 

</body></html> 
2

如果這是你的整個文件,那麼問題是,你不告訴它「標籤,選擇」分區應該是標籤。我沒有測試過,但增加了一個:

$('#tab-selected').tabs(); 

可能會做的伎倆。

+0

+1你比較接近,但不是確切的。 – 2009-09-18 11:17:54