javascript - ajax 调用在 IE 兼容模式下触发两次

Question

这是我正在使用的代码片段:

 var $container = $('#myNumRows');  
$container.scroll(function () {
   if ($container.scrollTop() == 0) {
    addRows('Top'); 
   } else if ($container.innerHeight() + $container.scrollTop() >= $container[0].scrollHeight ) {
     addRows('Bottom');
   } 

addRows 是一个带有参数的函数，用于标注“Top”或“Bottom”。

在 IE 兼容模式下，滚动到底部时会添加两次行。如果不在兼容模式下则不会发生，并且在任何其他浏览器(chrome、firefox)中也不会发生。我尝试在不同的地方使用超时，并且尝试使用 underscore.js 使用 debounce 进行多次迭代，但无论我做什么，当它到达滚动底部时，它都会在IE兼容模式。

谁能告诉我为什么会发生这种情况？

Answer 1

这看起来像一个 IE 兼容模式错误。 从我的 Angular 来看，最好的解决方案是添加一个变量，该变量需要在添加更多行之前再次向上滚动，如下所示:

var $container = $('#myNumRows'), bottom = false, top = false;  
$container.scroll(function () {
if ($container.scrollTop() == 0) {
  if (!top) {
    top = true;
    addRows('Top'); 
  } else {
    top = false;
  }
} else if ($container.innerHeight() + $container.scrollTop() >= $container[0].scrollHeight) {
  if (!bottom) {
    bottom = true;
    addRows('Bottom');
  } else {
    bottom = false;
  }
}