Jquery-UI选项卡不起作用

Question

Jquery-UI选项卡不起作用

所以我试图用JQuery UI框架制作标签,但我不能让它们起作用.它只是显示为项目符号列表,然后与div相互映射.我在另一篇文章中读到你需要某种我以前没有的css /主题,所以我下载了一个自定义主题.我在我的媒体文件夹中解压缩它,它创建了js,css和development-bundle文件夹.

我有两个js脚本包含在页面中,我检查了chrome开发人员工具,以确保他们正在加载,他们是.我也在我的文件中输入以下代码:

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

Run Code Online (Sandbox Code Playgroud)

不知道为什么它不起作用.

Answer 1

Cod*_*ous 8

您需要包含JQuery UI CSS文件.

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

Run Code Online (Sandbox Code Playgroud)

应该这样做.

归档时间：	16 年，1 月前
查看次数：	4480 次
最近记录：	16 年，1 月前