0

我没有在浏览器（谷歌浏览器）中获得 jquery tabstrip 的确切视觉样式。但是我按照 jquery UI 程序的步骤没有得到想要的结果。所有选项卡内容都显示在页面上，无需单击任何选项卡。

我的代码是：

<!doctype html>

<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>jQuery UI Tabs</title>
    <link rel="stylesheet" href="~/Scripts/jquery-ui.css" />
    <script src="~/Scripts/jquery-1.9.1.js"></script>
    <script src="~/Scripts/jquery-ui.js"></script>
    <link rel="stylesheet" href="~/Content/style.css" />
    <script>
    $(function() {
    $( "#tabs" ).tabs();
    });
    </script>
    </head>
<body>

<div id="tabs">
      <ul>
        <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 id="tabs-1">
         <p>Tab1 contents  </p>
    </div>

    <div id="tabs-2">
          <p>Tab2 contents  </p>
    </div>

    <div id="tabs-3">
          <p>Tab3 contents  </p>
    </div>
</div>

</body>
</html>

我错过了什么吗？我应该包含更多的 java 脚本文件吗？请告诉我。

提前致谢。

4

1 回答 1

0

您在 jsfiddle.net/z5qWk/ 上工作的代码

您应该检查您的脚本和样式表引用。通常，这可以通过检查浏览器开发工具并检查错误和网络选项卡来完成。

于 2013-08-17T13:23:45.420 回答