Javascript 根据滚动位置更新选择菜单中的选定选项

我有一个单页网站，使用标准ul菜单作为导航，然后在移动设备上使用选择菜单。我已经根据visible/scrolled-to-div整理了如何设置“active”菜单项，但不确定如何更改active选项以实现相同的效果。我在这里放了一把小提琴，让你看看我目前的处境。代码也在下面

//此函数将在用户滚动页面时执行。
$（窗口）。滚动（功能（e）{
//获取滚动条启动位置的位置。
var scroller_anchor=$（“.scroller_anchor”）.offset（）.top；
//检查用户是否已滚动，当前位置是否在滚动器的开始位置之后，以及是否尚未固定在顶部
if（$（this）.scrollTop（）>=滚动器锚定&$（'.scroller'）.css（'position'）！='fixed'）
{//将滚动条的CSS更改为hilight，并将其固定在屏幕顶部。
$（'.scroller'）.addClass（'sloozis'）；
//将scroller锚定的高度更改为scroller锚定的高度，以便页面的总体高度不会发生变化。
$（'.scroller_-anchor'）.css（'height'，'50px'）；
} 
else if（$（this）.scrollTop（）

修复：

如果无法更新所选选项，请在更新定位点的位置添加类似以下内容：

if (lastId !== id) {
    lastId = id;
    // Set/remove active class
    menuItems.parent().removeClass("active")
        .end().filter("[href=#" + id + "]").parent().addClass("active");

    //added to update the correct option in the dropdown menu
    $('option[value="#' + id + '"]').attr('selected','selected');
}

---

jQuery在代码示例中使用，但您没有添加“jQuery”标记。您想要纯JavaScript解决方案吗？添加了jquery标记-感谢您捕捉到：）这看起来很接近…我看到，如果您向下滚动到最顶端，选择将更改回主页…但是，当滚动Chrome和IE中的较低分区时，我看不到它正在更改，它会正常执行。你在做什么？很有意思-我在电脑上用Chrome进行了测试，但它不起作用。在我的MacBook上进行了Chrome测试，效果非常好。感谢您的解决方案，先生：）和额外的好处-将平滑滚动绑定到选择菜单？如果您将当前单击事件绑定到选择元素的更改事件，则可以使用绑定到当前单击事件的相同功能。

if (lastId !== id) {
    lastId = id;
    // Set/remove active class
    menuItems.parent().removeClass("active")
        .end().filter("[href=#" + id + "]").parent().addClass("active");

    //added to update the correct option in the dropdown menu
    $('option[value="#' + id + '"]').attr('selected','selected');
}