Scroll-Ereignis an div mit Körper anhängen() Bindung schlägt fehl

Question

Ich habe einige Probleme mit dem Scroll-Ereignis.

Ich versuche, um das Ereignis zu einem bestimmten div anhängen/binden, und ich bin mit $('body').on(), es zu tun, aufgrund der Tatsache, dass der Inhalt neu geladen wird, wenn das Sortieren, so werden sie verlieren ihre Bindung. Diese auf der anderen Seite arbeitet

$('body').on('scroll', 'div.dxgvHSDC + div', function() { 
} 

:

Dies funktioniert nicht, wird das Ereignis nicht ausgelöst

$('body').on('mousewheel DOMMouseScroll', 'div.dxgvHSDC + div', function() { 
} 

Und dies auch:

$('div.dxgvHSDC + div').on('scroll', function() { 
} 

Was ist das Problem?

Answer 1

Sie können dem Ereignis scroll keine Delegierung hinzufügen. Dieses Ereignis lässt das DOM nicht explodieren und Sie können es daher nicht an ein Element delegieren. Sie finden weitere Informationen here:

Das Bildlaufereignis blubbert nicht.

Obwohl das Ereignis nicht bläst, zünden Browser ein Scroll-Ereignis sowohl im Dokument als auch im Fenster, wenn der Benutzer die gesamte Seite scrollt.

Sie müssen den Ereignishandler innerhalb des Ereignisses erstellen, das Ihr scrollendes Element erstellt.

Wohnbeispiel: http://jsfiddle.net/Um5ZT/1/

$('#link').click(function(){ 

    //dynamically created element 
    $('body').append('<div class="demo"></div>'); 

    //dynamically added event 
    $('.demo').on('scroll', function() { 
     alert('scrolling'); 
    }); 

}); 

Answer 2

Auf moderne Browsern (IE> 8), können Sie scroll Ereignis erfassen document Ebene für dynamisches Element z. Da jQuery die Erfassungsphase nicht implementiert, müssen Sie Javascript addEventListener() Methode verwenden:

document.addEventListener(
    'scroll', 
    function(event){ 
     var $elm = $(event.target); 
     if($elm.is('div.dxgvHSDC + div')){ // or any other filtering condition 
      // do some stuff 
      console.log('scrolling'); 
     } 
    }, 
    true // Capture event 
);