jQueryUI选项卡呈现但不起作用

Question

我正在使用jQueryUI标签作为Umbraco页面的一部分。这是该页面的核心HTML：

<asp:Content ContentPlaceHolderID="body" ID="ContentBody" runat="server">
    <cc1:UmbracoPanel runat="server" Height="224px" Width="412px" hasMenu="false" meta:resourcekey="PageTitle">
        <div style="padding: 2px 15px 0px 15px">
            <div class="dashboardWrapper">
                <div id="tabs">
                    <ul>
                        <li><a href="#tabs-1">Nunc tincidunt</a></li>
                        <li><a href="#tabs-2">Proin dolor</a></li>
                        <li><a href="#tabs-3">Aenean lacinia</a></li>
                    </ul>
                    <div id="tabs-1">
                        <p>Tab 1</p>
                    </div>
                    <div id="tabs-2">
                        <p>Tab 2</p>
                    </div>
                    <div id="tabs-3">
                        <p>Tab 3</p>
                    </div>
                </div>
            </div>
        </div>
    </cc1:UmbracoPanel>
</asp:Content>

尽管呈现了选项卡，但是可以在选项卡1中看到所有选项卡的内容。单击其他选项卡（如选项卡2或3）时，内容不会更改。就好像点击选项卡什么都不做。

我已经仔细检查了HTML，我不认为有任何不妥之处，例如id元素的div值与相应a中预期的值不同}标签，但我看不出有什么问题。

EDIT 啊，忘了jQuery：）

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <link rel="stylesheet" type="text/css" href="/umbraco_client/application/jquery/jquerytabs.css" />
    <script type="text/javascript" src="/umbraco_client/ui/jqueryui.js"></script>
    <script type="text/javascript">
        $(function () {
            $("#tabs").tabs();
        })
    </script>
</asp:Content>