0

スタッフ向けのランディング ページを作成しようとしている SharePoint 管理者で、jquery タブを使用したいと考えています。私はこのようなことに非常に慣れていないので、最善を尽くしています。これが状況です。

  1. Sharepoint 2010 を使用しています
  2. メイン ナビゲーションに Easytabs を使用しています
  3. 各 CEWP に、さまざまなコンテンツ (おそらく 4 つのインスタンス) 用の jquery タブを配置します。
  4. 最初のインスタンスは問題なく動作しますが、その後はすべて問題が発生しています。
  5. 最大の問題は、私の他のインスタンスでは他のタブが機能せず、すべてのコンテンツが最初のパネルに表示されることです。

これが私のコードです。ID からクラスへの変更を試み、以前の 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クラスを使用する 2 番目の関数がタグの外側にある理由はわかりませんが、htmlインスタンスごとに異なる ID をいつでも試すことができます。

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