Question

我在每个锚标记中都有一个空div，我在悬停时设置了样式。

html

<li><a href="#events">SPECIAL EVENTS <div></div></a></li>

CSS

a:hover div, a:active div{
    color: $black;
    height: 1px;
    background-color: $black;
    width: 100%;
    margin-top: 5px;
}

我还有一个活跃的类，我附加点击一些js。这目前正常。

var currentDiv;

function addSelected(){

if(currentDiv !== undefined){
    $(currentDiv).removeClass("active");    
}

currentDiv = $(this).find('div');
$(currentDiv).addClass("active");
}

$(".menu a").click(addSelected);

我要做的是根据用户滚动附加相同的活动类。我得到了大部分工作，但我似乎无法想象如何将类附加到div，而不是锚本身。这是我和我一起工作的人。

JS

    // Cache selectors
var lastId,
topMenu = $("#desktop-nav"),
topMenuHeight = topMenu.outerHeight()+15,
// All list items
menuItems = topMenu.find("a"),
// Anchors corresponding to menu items
scrollItems = menuItems.map(function(){
  var item = $($(this).attr("href"));
  if (item.length) { return item; }
});

// Bind to scroll
$(window).scroll(function(){
// Get container scroll position
var fromTop = $(this).scrollTop()+topMenuHeight;

// Get id of current scroll item
var cur = scrollItems.map(function(){
 if ($(this).offset().top < fromTop){
   return this;
 }  
});
// Get the id of the current element
cur = cur[cur.length-1];
var id = cur && cur.length ? cur[0].id : "";

if (lastId !== id) {
    lastId = id;
    // Set/remove active class
    menuItems

    //.parent().removeClass("active")
    //.end().filter("[href='#"+id+"']").parent().addClass("active");

    .removeClass("active");
    end().filter($("[href='#"+id+"']")).find('div').addClass("active");

    console.log(id);
}                   
});

我认为我试图改变的部分是这个

"[href='#"+id+"']").parent()

但我尝试的一切都是不工作或给我错误。

修改

这是我试图修改的小提琴。

fiddle link

Answer 1

尝试将其更改为使用find（），就像在点击处理程序中一样：

"[href='#"+id+"']").find('div')

Answer 2

使用children()代替parent()或find()

示例：

if (lastId !== id) { lastId = id; // add/remove active class on div menuItems .children().removeClass("active") .end().filter("[href='#"+id+"']").children().addClass("active"); }

Answer 3

我猜你已经尝试过......

"[href='#"+id+"'].div"

和/或...

class

...如果是这样，您是否可以向id添加div或df$count = sequence(rle(df$a)$lengths) df并以此方式定位？

通过javascript滚动添加css类

3 个答案: