Empêcher les erreurs Max Stack Call pour le défilement div

Question

scroller1 scroller2 
----------- ----------- 
|this is o| |this is a| 
|ne elemen| |nother el| 
|t, four l| |3 lines | 
|ines  | |   | 
----------- ----------- 

Ceci est un exemple simple de configuration. J'ai mis en place un système qui défilera jusqu'au nième élément de chaque scroller, mais aussi en utilisant des fractions de sorte que si scroller1 est à l'élément 4 et à mi-chemin à cinq, il fera la même chose pour scroller2. Mais quand j'appelle la fonction 'onscroll', elle place l'autre scroller aux bonnes positions, puis appelle 'onscroll' parce que son scrollTop est en train de défiler. Cela se répète à son tour jusqu'à ce que Javascript lève l'erreur Max Stack Call, ou les deux dérouleurs atteignent le bas.

Comment cela peut-il être évité?

Answer 1

Créer une variable globale, currentlyHandlingScrollEvent et votre onscroll Code mettent des conditions sur cette base:

var currentlyHandlingScrollEvent = false; 
function handleScroll (e) { 
    if (!currentlyHandlingScrollEvent) { 
    currentlyHandlingScrollEvent = true; 
    // do stuff ... 
    currentlyHandlingScrollEvent = false; 
    } 
} 

scroller1.onscroll = handleScroll; 
scroller2.onscroll = handleScroll;