javascript - jQuery 选项卡不起作用

Question

我正在尝试实现 jQuery 选项卡来替换 AJAX 选项卡容器。我遵循了 jquery website 中的代码但我的标签没有显示。它只是加载整个页面的数据，没有标签。 firebug 告诉我以下错误:

$("#tabs").tabs 不是函数

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

我已经获得了对所有需要的文件的引用:

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

我得到了如下指定的函数:

  <script type="text/javascript">
     $(document).ready(function() {
         $("#tabs").tabs();
     });

  </script>

标签的代码如下:

div id="tabs">
    <ul>
        <li><a href="#tab-1"><span>Patient Information</span></a></li>
        <li><a href="#tab-2"><span>Medical History 1 of 3</span></a></li>
        <li><a href="#tab-3"><span>Medical History 2 of 3</span></a></li>
        <li><a href="#tab-4"><span>Medical History 3 of 3</span></a></li>
        <li><a href="#tab-5"><span>Scheduler</span></a></li>
        <li><a href="#tab-6"><span>Care Plan</span></a></li>
    </ul> 
<div id="tab-1">
</div>
**Repeats for all tabs through tab-6**
</div>

谁能告诉我我做错了什么？由于 .tabs() 函数不起作用，页面只是像这样加载 -

Answer 1

您的代码运行良好。您唯一缺少的是选项卡的 CSS - http://jsfiddle.net/8JX4A/