Jquery UI选项卡不能与.tabs（）函数一起使用

Question

我完全是JQUERY的新手，我有一个项目，我必须使用JQUERY UI标签我下载了一个UI标签，并按照here上列出的所有说明进行操作  我的HTML代码是：

   <div id="tab">
    <ul class="tabs">
        <li><a href="#tabs-1">Tab1</a></li>
        <li><a href="#tabs-2">Tab2</a></li>
        <li><a href="#tabs-3">Tab3</a></li>
    </ul> 
    <div class="tab-content" id="tabs1">Tab1</div>
    <div class="tab-content" id="tabs2">Tab2</div>
    <div class="tab-content" id="tabs3">Tab3</div> </div>

我的JQUERY函数是：

    <script type="text/javascript">

    $(document).ready(function () {
        $('#tab').tabs();
    });
</script>

问题是，当我运行页面时，它显示输出如下：

我无法使用TABS ...我会非常感谢你在这方面给予的帮助

提前致谢并寻求您的提示帮助

Answer 1

标签按钮中的链接：

<li><a href="#tabs-1">Tab1</a></li>
<li><a href="#tabs-2">Tab2</a></li>
<li><a href="#tabs-3">Tab3</a></li>

需要匹配标签的id属性。您的链接使用tabs-1，tabs-2和tabs-3，但您的标签使用tabs1，tabs2和tabs3。

演示：http://jsfiddle.net/ambiguous/kbfjS/

Answer 2

将内容div重命名为此，您可以获得短划线-。

<div class="tab-content" id="tabs-1">Tab1</div>
<div class="tab-content" id="tabs-2">Tab2</div>
<div class="tab-content" id="tabs-3">Tab3</div>