浏览器忽略jQuery/javaScript（引导）

html中访问jquery库和jquery代码的代码如下：

<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>

<script src="script.js"></script>

我编写的jQuery/javascript如下：

var main = function(){
    var navLocation = $('.nav').offset();
    if (navLocation.top < 0){
        $('.nav').addClass('navbar-fixed-top')
    }
}
$(document).ready(main);

var main=function（）{
var navLocation=$（'.nav'）.offset（）；
如果（navLocation.top<0）{
$（'.nav'）.addClass（'navbar-fixed-top'））
}
}
$（文件）.ready（主）；

---

我试图做的是，当你滚动浏览导航栏时，让它粘在页面的顶部，但它只是正常地滚动离开页面。我认为浏览器忽略了代码，因为我要么访问jQuery库时出错，要么是因为我个人编写的代码中有错误。如果有人能帮我解决这个问题，我将不胜感激。

当您的文档准备就绪时，您的代码只被调用一次。如果此时

.nav

未滚动到负值，则不会添加该类；否则它会。如果您想让它动态响应，您需要安装一个

scroll

事件处理程序。在这种情况下，您可能还需要删除该类。

问题 加载DOM后，

main（）

函数只会被调用一次，因此

navLocation

值很可能为0。此后，您的函数将不再执行，因此您永远不会将

'navbar-fixed-top'

类添加到

.nav

菜单中

解决方案 要纠正这种情况，请尝试按如下方式替换主功能：

var main = function(){
    $( window ).scroll(function() {
        if ($('.nav').offset().top < 0){
            $('.nav').addClass('navbar-fixed-top');
        }else{
            $('.nav').removeClass('navbar-fixed-top');
        }
    });
}

var main=function（）{
$（窗口）。滚动（函数（）{
如果（$（'.nav'）.offset（）.top<0）{
$（'.nav'）.addClass（'navbar-fixed-top'）；
}否则{
$（'.nav'）.removeClass（'navbar-fixed-top'）；
}
});
}

解释 我在窗口中附加了一个滚动处理程序，因此当用户滚动时，会触发此事件，允许您计算是否需要在标题中添加或删除类

选择 我提供的Javascript应该可以解决您的问题，但我建议您使用纯CSS查看粘性标题，因为在加载任何UI元素时，您不希望依赖Javascript

---

甚至像

位置这样的解决方案：固定

比摆弄Javascript更好。

在您的情况下，您甚至不需要jquery来使navbar粘到顶部。只需添加css属性

position:fixed