Javascript 从DOM中删除中键单击的元素时，滚动停止

我在自己的React虚拟化实现中处于齐腰深度，一直困扰我的一个小问题是，如果我用鼠标中键单击列表中的某个项目并开始滚动，一旦该元素从DOM中删除，滚动就会停止。我的第一个理论是，该元素正在获得关注，防止它会解决问题，但我尝试的方法没有奏效，我甚至不确定这是问题所在

我怎样才能防止这种情况发生

请参阅此小提琴以了解基本演示：

以及处理虚拟化的相关代码：

$('#container').scroll(function(e) {
  $('#container').children().each(function(i) {
     if ($('.item:eq(' + i + ')').length > 0) {
        if ($('.item:eq(' + i + ')').offset().top < 0) {
          $('.item:eq(' + i + ')').remove();
          $('#topPadding').height($('#topPadding').height() + 45);
        }
     }
  });
});

$（“#容器”）。滚动（函数（e）{
$（“#容器”）.children（）.each（函数（i）{
如果（$（'.item:eq（'+i+'））。长度>0）{
if（$（'.item:eq（'+i+'））.offset（）.top<0）{
$（'.item:eq（'+i+'））.remove（）；
$（'topPadding'）.height（$（'topPadding'）.height（）+45）；
}
}
});
});

---

基本上，我使用的是移除元素和增加填充的标准方法。在我的React实现中，这是不同的处理方式，但这里您得到了一个基本的功能表示。

您可以通过不让消失元素注册鼠标事件来解决这个问题

这可以通过CSS3实现：

div.item {
    pointer-events : none;
}

（不完全确定原因，但我的猜测是，一旦元素消失，事件的起源就会丢失，因此浏览器就会停止他们正在做的事情。）

---

这是非常模糊的，你必须分享一些代码，这将是困难的，因为这些代码是专有的，而且相当大。如果我没有从这里的答案/反馈中得到任何好的线索，我可以尝试创建一个小的概念证明，在某个时候演示这个问题。创建一个代表您的问题的最小版本并提供它。我自己的应用程序也有完全相同的问题，它不是专有的，所以我会分享一些code@gorhawk想知道你是否能够弄明白这一点，或者你是否可以在这里分享一些代码？我还没来得及解决这个问题，因为它目前在我的优先级列表中很低。这最终破坏了与嵌套表单元素的交互，这是我的用例所需要的。也就是说，这对我来说是一个足够好的改进，因为我可以重新启用表单元素。如果只有在中键单击表单元素时才会出现此问题，则似乎可以接受。如果没有更好的通用选项，我会在几天后接受这个答案。谢谢我不能100%确定为什么要在滚动时删除元素。不仅仅是隐藏它们是一个更好的主意吗？“窗口化”允许您大幅提高大型项目列表的性能，想想成千上万的DOM元素。通过只渲染窗口中可见的内容，浏览器不必构建所有这些额外项目，React也不必将道具更改等传播给它们。我发现它基本上消除了性能成本，并允许您呈现非常大和复杂的列表