Question

我在这个例子中工作：

并尝试让标签像他们在这个线框上看起来一样工作或者至少关闭：http://problemio.com/wireframe.pdf

到目前为止我的查询是：

$(function()
{
          $( "#tabs" ).tabs();
          ...

和这个html：

<div id="tabs">
    <ul>
        <li><a href="#tabs-1">First Tab</a></li>
        <li><a href="#tabs-2">Second Tab</a></li>
        <li><a href="#tabs-3">Third Tab</a></li>
    </ul>
    <div id="tabs-1">
        <p>First tab stuff</p>
    </div>
    <div id="tabs-2">
        <p>Second tab stuff</p>
    </div>
    <div id="tabs-3">
        <p>Third tab stuff</p>
    </div>
</div>

但由于某些原因，这根本不起作用，只是将tabl显示为不做任何事情的链接。我正在导入这个js：

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>

我做错了什么？

Answer 1

我自己已经遇到过这个问题。在我的情况下，我忘了为jquery UI插件添加css引用。您似乎也没有添加它们。

如果你已经加入了CSS，你可以再次检查吗？您应该可以使用googleapis CDN - 例如：

http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css

您可以在此处找到可用主题列表：JQuery-UI Blog - v1.8.16。它们还提供了各种可用CDN位置的链接（上面的链接是从那里获得的）。

Answer 2

我认为你可能错过了CSS。尝试加入

http://jqueryui.com/themes/base/jquery.ui.all.css

如何让jQuery选项卡工作？

2 个答案: