1

現在、次のコードを含むページでTwitter ブートストラップ タブを使用しています。URLにハッシュタグをプッシュするためにjavascript/jqueryを少し追加したので、実際にタブにリンクできます。これは問題なく動作しますが、最初のタブを読み込むとページ全体が表示され、すぐに最初のタブだけが表示されます。これで、ページのタブをクリックするとすべてがうまく機能し、ページ全体が再び表示されることはありません。このデータのフラッシュは、控えめに言っても煩わしいものです。私が間違っていることについてのアイデアはありますか?

Jade Template Code、標準の HTML にコンパイル

    div(class="tabbable")
      ul(id="myTab", class="nav nav-tabs")
        li
          a(href="#surveyEditData", data-toggle="tab") Survey
        li
          a(href="#surveyEditQuestions", data-toggle="tab") Questions
        ...etc...

JavaScript コード:

    $(function(){
      // Function to activate the tab
      function activateTab() {
        var activeTab = $('[href=' + window.location.hash.replace('/', '') + ']');
        activeTab && activeTab.tab('show');
      }

      // Trigger when the page loads
      activateTab();
    });
4

1 に答える 1

1

Javascriptの実行が完了する前に、HTMLのレンダリングに遅延が見られます。

これを修正するには、最初のタブを除く他のすべてのタブに、フェードや非表示などの初期CSSスタイルを配置する必要があります。

CSSルールはレンダリング中にすぐに実行されるため、これらのルールに遅延はありません。

于 2013-03-22T23:45:16.877 に答える