如何通过单击主菜单栏的子菜单激活/重新聚焦仪表板UI选项卡

时间:2014-09-04 04:33:02

标签: javascript jquery html tabs jquery-ui-tabs

我有一个菜单“任务”,主菜单栏中的子菜单名称为“已分配”,“未分配”和“摘要”。

在菜单的下方仪表板页面中,我有名为“已分配”,“未分配”,“报告”,“已批准”等的UI选项卡...

我的问题是,如果我单击子菜单“UnAssigned”,UI选项卡“UnAssigned”需要激活并显示其内容,如果我单击子菜单“已分配”,UI选项卡“已分配”将激活并显示其内容

主菜单的html代码......

     <ul>
      <?php
      if ($usergroup!='DigitizationArtist' && $usergroup!='GraphicArtist')
      { echo '<li><span onclick="UnAssigned()"><a href="">UnAssigned</a></span></li>';}
      ?>
      <li><span onclick="Assigned()"><a href="">Assigned</a></span></li>
      <li><span onclick="Completed()"><a href="#">Completed</a></span></li>
      <li><span onclick="Approved()"><a href="#">Approved</a></span></li>
    </ul>

我的jquery用于活动分配和未分配..

 <script>
  $(function (Assigned)
  {
    $( "#tabs" ).tabs({ active: 1 });
  });
 </script>
 <script>
  $(function (UnAssigned)
  {
   $( "#tabs" ).tabs({ active: 0 });
  });
 </script>

用于UI标签的html编码......

    <div id="tabs" class="uitabs">
    <ul>
        <li><a href="#tabs-1" id="tab-1">Un Assigned</a></li>
        <li><a href="#tabs-2" id="tab-2">Assigned</a></li>
        <li><a href="#tabs-3" id="tab-3">Summary</a></li>
    </ul>
    <div id="tabs-1"></div>
    <div id="tabs-2"></div>
    <div id="tabs-3"></div>

请告知...我的jquery编码有什么问题......(我是jquery的新手)

否则请帮助我使用其他javascripts。

1 个答案:

答案 0 :(得分:0)

我上传了云。

检查this