Question

在我的网络应用程序中，我使用jquery生成一个标签区域，我可以在其中检索学生列表。出于某种原因，选项卡没有显示，而是给了我一个项目符号列表。

我从早些时候看过这个问题的几个答案，并且已经实现了建议（我认为），但仍然没有。

这一切都适用于我在同一台服务器上运行的另一个网络应用

       <link     rel="stylesheet"href="/../../../code.jquery.com/ui/1.11.4/themes/smoothness/jque    ry-ui.css">
  <script src="/../../../code.jquery.com/jquery-1.10.2.js"></script>
  <script src="/../../../code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script>
  $(function() {
    $( "#tabs" ).tabs();
  });
  </script>
   <style>
         #tabs{font-size: 14px;}
         .ui-widget-header {
            background:#b9cd6d;
            border: 1px solid #A7C942;
            width:600;
            color: #FFFFFF;
            font-weight: bold;
         }
     </style>

实际标签的HTML

    <div id="tabs" align="center" width="700">
  <ul>
    <li><a href="listseniors.php">Seniors</a></li>
    <li><a href="listjuniors.php">Juniors</a></li>
    <li><a href="listsophomores.php">Sophomores</a></li>
    <li><a href="listfreshmen.php">Freshmen</a></li>
  </ul>
  <div id="tabs-1">
    </div>
  <div id="tabs-2">
    </div>
  <div id="tabs-3">
    </div>
  <div id="tabs-4">
    </div>
</div>

<div id="student_data" align="center"></div>

我已经将代码与其他应用进行了比较，但它看起来完全相同，所以我不知道接下来要检查什么。

由于

Answer 1

使用这些链接时，您的代码可以正常运行

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

https://jsfiddle.net/66eoc1md/1

＆＃13;

$(function() {
  $("#tabs").tabs();
});

＆＃13;

 #tabs {
   font-size: 14px;
 }
 
 .ui-widget-header {
   background: #b9cd6d;
   border: 1px solid #A7C942;
   width: 600;
   color: #FFFFFF;
   font-weight: bold;
 }

＆＃13;

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>


<div id="tabs" align="center" width="700">
  <ul>
    <li><a href="#tabs-1">Seniors</a></li>
    <li><a href="#tabs-2">Juniors</a></li>
    <li><a href="#tabs-3">Sophomores</a></li>
    <li><a href="#tabs-4">Freshmen</a></li>
  </ul>
  <div id="tabs-1">1
  </div>
  <div id="tabs-2">2
  </div>
  <div id="tabs-3">3
  </div>
  <div id="tabs-4">4
  </div>
</div>

<div id="student_data" align="center"></div>

＆＃13;

编辑：我还修复了a href=

Jquery选项卡显示为子弹列表

1 个答案: