Question

我正在尝试使用带有Scrollspy的Bootstrap 3 RC1创建一个站点。我的网页现在很简单，基本上就像这样设置：

<html>
    <head>
        <!-- Head stuff here -->
    </head>

    <body>
        <section id="section_1" data-spy="scroll">
            <!-- stuff in here -->
        </section>
        <section id="section_2" data-spy="scroll">
            <!-- stuff in here -->
        </section>
        <section id="section_3" data-spy="scroll">
            <!-- stuff in here -->
        </section>

        <JScripts here ... />
    </body>
</html>

我通过调用$("section").scrollspy()初始化了Scrollspy，并且我已经设置了这样的事件处理程序：

$("section").on("activate", function(e) {
    // do stuff
});

我的问题是这个activate事件永远不会被触发。有谁知道它为什么不起作用？我注意到所有教程都使用导航栏突出显示当前部分，但我真的不想要一个导航栏。

Answer 1

你对scrollspy的标记有点偏。 Scrollspy可能不会被解雇，这就是为什么你可能没有得到任何结果。根据我的经验，使用数据属性来启动scrollspy要容易得多。如果你将滚动侦听器附加到除了正文本身之外的任何其他元素，我还没有读过它的一个报告。

你应该像这样将它们应用到你的身体标签。

<body data-spy="scroll" data-target="#YOUR NAV CONTAINER">

此外，您需要确保您的导航结构如下：

<div id="YOUR NAV CONTAINER">
     <ul class="nav">
          <li><a href="#SECTIONID">list item</a></li>
          <li><a href="#SECTIONID">list item2</a></li>
     </ul>
</div>

Bootstrap 3 Scrollspy激活事件未触发

1 个答案: