1

所以我在使用来自 Jquery UI 的选项卡 UI 时遇到了问题。我看了很多论坛，但没有找到为什么我的标签没有出现。我的 css 看起来不错，并且指向 jquery ui 脚本的链接正在工作。

这是我的代码：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>Home Page - My ASP.NET MVC Application</title>
        <link href="/favicon.ico" rel="shortcut icon" type="image/x-icon" />
        <link type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.10/themes/redmond/jquery-ui.css" rel="stylesheet" />

    </head>
    <body class="body">
<script type="text/javascript">
    $(function () {
        $("#tabs").tabs();
    });
    </script>

<div id="tabs">
    <ul>
            <li><a href="#tabs-1">Ce soir</a></li>
            <li><a href="#tabs-2">France 1</a></li>
            <li><a href="#tabs-3">France 0</a></li>
            <li><a href="#tabs-4">France 4</a></li>
            <li><a href="#tabs-5">France 3</a></li>
            <li><a href="#tabs-6">France 2</a></li>
            <li><a href="#tabs-7">TF1</a></li>
    </ul>
    <div id="tabs-1">page 0</div>
    <div id="tabs-2">page 1</div>
    <div id="tabs-3">page 2</div>
    <div id="tabs-4">page 3</div>
    <div id="tabs-5">page 4</div>
    <div id="tabs-6">page 5</div>
    <div id="tabs-7">page 6</div>
</div>
        <footer>

        </footer>

         <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>

        <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js"></script>


    </body>
</html>

任何想法是错误的？

非常感谢。

纪尧姆

4

2 回答 2

5

你需要把你的脚本块放在你的包含之后

工作小提琴：http: //jsfiddle.net/BLSully/4ZJns/

原因：$未在脚本块当前所在的页面中定义。另一种选择是将您的包含放在顶部附近或<head>...中。但在接近末尾理论上应该可以改善 JS 重页面中的页面加载时间

于 2012-09-25T19:58:52.467 回答
2

加载 .js 文件后，将脚本块移动到底部。

于 2012-09-25T20:01:25.210 回答