0

我是一名共享点管理员,试图为我的员工创建登录页面,我想使用 jquery 选项卡。我对这些东西很陌生,并且正在尽力而为。这是情况。

  1. 我正在使用 Sharepoint 2010
  2. 我正在使用 Easytabs 进行主导航
  3. 在每个 CEWP 中,我都会为各种内容放置 jquery 选项卡(可能是 4 个实例)
  4. 第一个实例工作正常,之后的一切都是问题。
  5. 最大的问题是我的其他实例其他选项卡不起作用,所有内容都显示在第一个面板中。

这是我的代码。尝试从 ID 更改为 class 并从早期的 jquery 论坛(https://groups.google.com/forum/#!topic/jquery-ui/JxKuwyrdC9A)复制了一些脚本

<!doctype html>

<html lang="en">

<head>

  <meta charset="utf-8">

  <title>jQuery UI Tabs - Default functionality</title>

  <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>

  <link rel="stylesheet" href="/resources/demos/style.css">

  <script>

  $(function() {

    $( "#tabs" ).tabs();

  });

  </script>

</head>

<body>



<div class="tabs">

  <ul>

    <li><a href="#tabs-anes1">Main Links</a></li>

    <li><a href="#tabs-anes2">Anesthesia Guidelines</a></li>

    <li><a href="#tabs-anes3">Regional Anesthesia</a></li>

    <li><a href="#tabs-anes4">TeamSTEPPS</a></li>

    <li><a href="#tabs-anes5">Announcements</a></li>

    <li><a href="#tabs-anes6">Notes</a></li>

  </ul>

  <div class="tabs-anes1">

    <p>tabs1.</p>

  </div>

  <div class="tabs-anes2">

    <p>tabs2.</p>

  </div>

  <div class="tabs-anes3">

    <p>tabs3</p>

  </div>

<div class="tabs-anes4">

    <p>tabs4.</p>

  </div>

<div class="tabs-anes5">

    <p>tabs5.</p>

  </div>

<div class="tabs-anes6">

    <p>tabs6.</p>

  </div>



</div>





</body>

</html>

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

我在这里做错了什么?

4

1 回答 1

0

我不确定为什么tabs使用该类的第二个函数在html标记之外,但您始终可以尝试在每个实例上使用不同的 ID。

$("#tabs1, #tabs2, #tabs3").tabs();
于 2015-08-10T18:21:41.343 回答