Как обрабатывать два события прокрутки на веб-странице - PullRequest
Новая
       15

Как обрабатывать два события прокрутки на веб-странице

0 голосов
/ 19 октября 2019

две функции JS загружает при прокрутке. Скажем, есть два события прокрутки для обработки 

window.onscroll = function(e) {
  var footerHeight = 500;
  if ((window.innerHeight + window.scrollY + footerHeight) >= document.body.offsetHeight) {
    if (branchLoaded == false) {
      loadBranch1();
    };
  }
};

window.onscroll = function(e) {
  var footerHeight = 500;
  if ((window.innerHeight + window.scrollY + footerHeight) >= document.body.offsetHeight) {
    if (branchLoaded == false) {
      loadBranch2();
    };
  }
};

1 Ответ

1 голос
/ 19 октября 2019

В вашем коде обработчик второго события переопределяет первый.

Это похоже на <element onload="function(){}" onload="function(){}">. В нем будет выполняться только последний.

Пример 

window.onscroll = function(){console.log(1)}
window.onscroll = function(){console.log(2)}
<div>Test<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>Bottom</div>

Решение

Вам необходимо addEventListener для настройки нескольких прослушивателей событий. 

window.addEventListener('scroll',function(){console.log(1)});
window.addEventListener('scroll',function(){console.log(2)});
<div>Test<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>Bottom</div>
...