Jquery-UI選項卡不工作

所以我試圖製作JQuery UI框架的選項卡，但我無法讓它們工作。它只是作爲一個項目符號列表顯示出來，然後與所有的div一起顯示出來。我讀過另一篇文章，你需要某種我以前沒有的css /主題，所以我下載了一個自定義主題。我將它解壓縮到我的媒體文件夾中，並創建了js，css和development-bundle文件夾。Jquery-UI選項卡不工作

我有頁面中包含兩個js腳本，我檢查了鉻開發工具，以確保他們正在加載，他們是。我也ahve在我的文件中的以下代碼：

<head> 
<script type='text/javascript'> 
$(document).ready(function(){ 
    $("#tabs").tabs(); 
}); 
</script> 
</head> 
<div id='tabs'> 
    <ul> 
     <li><a href='#tabs-1'>Manage Categories</a></li> 
     <li><a href='#tabs-2'>Add Forms</a></li> 
     <li><a href='#tabs-3'>Change Forms</a></li> 
    </ul> 
    <div id='tabs-1'> 
     <h4>Current Categories</h4> 
     {% for category in categories %} 
      <a href='/admin/fm/delcat/{{ category }}/'>Delete</a> &nbsp;&nbsp;&nbsp; {{ category }}<br /> 
     {% endfor %} 
    </div> 
    <div id='tabs-2'> 
     <p> stuff</p> 
    </div> 
    <div id='tabs-3'> 
     <p>stuff</p> 
    </div> 
</div>

不知道爲什麼它不工作。

來源

2010-01-16 The.Anti.9

您需要包含JQuery UI CSS文件。

<link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css" rel="stylesheet" />

這應該做到這一點。

來源

2010-01-16 07:26:20

爲了重現您所描述的內容，我必須省略樣式表。這表明你還沒有完全掌握CSS部分。

了jQuery網站上的標籤示例代碼是一個良好的開端，這是我複製了以下內容，然後在你的代碼的頂部粘貼

<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>

來源

2010-01-16 07:32:50

Jquery-UI選項卡不工作

回答

相關問題