Javascript 为什么<；选择多个>；框滚动到顶部，默认为Chrome

每次我添加一个事件列表器，该列表器对选择框的更改执行

preventDefault

，它就会滚动到顶部

有关最简单的示例，请参见以下内容：

document.getElementById（'foo'）.onmousedown=function（e）{
e、 target.parentElement.focus（）；
e、 target.selected=！e.target.selected；
e、 预防默认值（）；
返回false；
}

1.
2.
3.
4.
5.
6.
7.
8.
9
10

尝试此解决方法（至少在Chrome中有效）：

document.getElementById（'foo'）.onmousedown=function（e）{
e、 预防默认值（）；
var st=this.scrollTop；
e、 target.selected=！e.target.selected；
setTimeout（（）=>this.scrollTop=st，0）；
这是focus（）；
}
document.getElementById（'foo'）.onmousemove=function（e）{
e、 预防默认值（）；
}

1.
2.
3.
4.
5.
6.
7.
8.
9
10

我通过添加一个具有

overflow-y:auto；边框：1px实心暗灰色然后设置
溢出：可见；边界：无，但这当然是一个真正的黑客补丁（因此我在评论中发布此解决方案，而不是作为自我回答）。我仍然在寻找解决这个问题的好方法。我认为没有任何方法可以控制本机元素（如多选框）的行为。顺便说一句，Safari也有缺陷，但FF没有。所以这可能是WebKit的问题。它实际上不会滚动到顶部，而是滚动到您第一次选择的项目。即使它不再被选中。因此，如果您选择4，2，取消选择4，然后选择10，它将滚动到4。很奇怪，它还记得这些。很难想象这样的错误是怎么发生的，似乎这必须是你努力去做的事情。@Barmar我认为这根本不是一个复制品。我不是想让选择元素的行为像按下ctrl键一样，而是想让框在使用preventDefault时停止滚动到第一个选择的元素。顺便说一句，我看到它已经被回答了，所以应该标记为重复。。