Question

我正在尝试捕获Scrollspy事件以运行函数。 Scrollspy正在努力更改导航栏上的激活链接。但我无法捕捉到在其他地方使用它的事件。

这是代码的片段：

<body data-spy="scroll" data-target="#navbar" data-offset="30">

<script>
$(document).ready(function(){
    $('body').scrollspy({target: "#navbar", offset: 30});   
});


$(document).ready(function(){
    $('#navbar').on('activate.bs.scrollspy', function() { 
        console.log('sparkle, sparkle');
    });
});
</script>

据我所知，在某些版本的Bootstrap中捕获事件是不可能/有效吗？

请告知。

Answer 1

实际上，这是Bootstrap 4中没有很好记录的极少数事情之一 - 或者是buggy-。正如您已经在Scrollspy文档的Events部分阅读的那样，activate.bs.scrollspy事件应该在滚动元素上发出 - 具有data-spy="scroll" - 的事件，并进行相应处理：

$('[data-spy="scroll"]').on('activate.bs.scrollspy', function(event) {
    console.log('activate.bs.scrollspy', event);
})

但是，没有记录，当在<body>元素上使用Scrollspy时，activate.bs.scrollspy事件将仅在window对象上可用。
所以，您可以像这样捕获此Scrollspy事件：

$(window).on('activate.bs.scrollspy', function (event) {
    console.log('activate.bs.scrollspy', event);
})

使用JQuery从Bootstrap Scrollspy触发事件

1 个答案: