Question

我正在使用以下脚本将点击的“nav”元素类更改为导航栏中的“有效”类。

$('nav a').click(function(e) {
        e.preventDefault();
        $('nav a').removeClass('active');
        $(this).addClass('active');
    });

当它在我的jsFiddle中被隔离时它起作用：

http://jsfiddle.net/shockabout/ECshM/

但它不适用于我的开发网站：

https://dl.dropboxusercontent.com/u/102203801/HTML/index.html

我无法找到阻止“活动”类被应用的内容。我是否必须添加所有父类？

Answer 1

我刚刚将您的代码粘贴到主站点的控制台中，它完美无缺。我在页面上注意到你有一个装载机。在nav元素存在之前，你确定jQuery代码没有运行吗？

我认为正在发生的是，页面加载，DOM在技术上准备就绪，因此jQuery绑定click事件，但这些元素不存在，因为你有其他代码加载内容，所以jQuery没有实际上绑定任何东西。

尝试稍微改为

$("body").on("click", "nav a", function(e){
    e.preventDefault();
    $('nav a.active').removeClass('active');
    $(this).addClass('active');
});

然后它应该适合你

Answer 2

我认为这是不行的，因为这里锚标签必须同时做两个任务 1.需要自己添加课程 2.需要将用户带到id为href of anchor tag

的div

你可以尝试这段代码。

它将绑定点击功能以激活锚标记，然后通过滚动效果将用户移动到新的div。

$('nav li a').click(function(e) {
        e.preventDefault();
        $('nav a').removeClass('active');
        $(this).addClass('active');
        var id=$(this).attr('href');
       scrollToId(id);
    });

    function scrollToId(id){
                $('html, body').animate({
                    scrollTop: $(id).offset().top
                     }, 2000);    
    }

addClass脚本不适用于nav元素

2 个答案: