3

タブを使用するページに ScrollSpy を実装しようとしています。

これは私のボディタグです:

<body data-spy="scroll" data-target=".subnav" data-offset="50">

これは私のタブの HTML です:

<div class="div-tabs tabbable">
    <ul class="nav nav-tabs" id="myTab">
        <li class="active"><a href="" data-toggle="tab" data-target="#home">Home</a></li>
        <li><a href="" data-toggle="tab" data-target="#profile">Profile</a></li>
    </ul>
    <div id="myTabContent" class="tab-content">
        <div class="tab-pane active" id="home">
            <div class="padding16">
                   ...
            </div>
            <div class="button-bar">
                <a href="#" class="btn"><i class="icon-user"></i>Button</a> <a href="#" class="btn btn-primary">
                    <i class="icon-time icon-white"></i>Button</a> <a href="#" class="btn btn-warning">Button</a>
                <a href="#" class="btn btn-danger">Button</a> <a href="#" class="btn btn-success">Button</a>
            </div>
        </div>
        <div class="tab-pane " id="profile">
            <div class="padding16">
               ...
            </div>
            <div class="button-bar">
               <a href="#" class="btn btn-warning">Button</a>
                <a href="#" class="btn btn-danger">Button</a> <a href="#" class="btn btn-success">Button</a>
            </div>
        </div>
    </div>
</div>

data-spy="scroll" data-target=".subnav" data-offset="50"タグからを削除すると、タブは正常に機能します。scrollspy を有効にすると、Chrome 開発ツールで次のエラーが表示されます。

キャッチされていない TypeError: null のプロパティ 'top' を読み取れません

何が間違っている可能性がありますか？ScrollSpy が原因で Bootstrap タブが HREF 属性への参照を見つけられないようです。

Bootstrap 2.0.2 を使用しています

4

1 に答える 1

12

マークアップにまだ存在していないアンカーへのリンクがナビゲーションにあるときに、このエラーが発生しました。たとえば、ナビゲーション バーのリンクが にリンクされている#aboutが、ページに要素が存在しない場合、id="about"このエラーが表示されます。

于 2012-05-28T00:22:28.277 に答える