15

スクロールイベントで困っています。

イベントを特定の div にアタッチ/バインドしようとし$('body').on()ていますが、並べ替え時にコンテンツがリロードされるため、それを使用しているため、バインドが失われます。

これは機能しません。イベントは発生しません:

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

一方、これは機能します:

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

そしてこれも:

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

どうしたの?

4

2 に答える 2

32

scrollイベントに委任を追加することはできません。このイベントは DOM をバブルアップしないため、どの要素にも委任できません。詳細については、次を参照してください

スクロール イベントはバブルアップしません。

イベントはバブリングしませんが、ユーザーがページ全体をスクロールすると、ブラウザーはドキュメントとウィンドウの両方でスクロール イベントを発生させます。

スクロール要素を作成するイベント内にイベント ハンドラーを作成する必要があります。

実際の例: 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');
    });
    
});
于 2013-09-26T14:16:27.617 に答える
15

最新のブラウザー (IE>8) では、動的要素のレベルなどにscrollイベントをキャプチャできます。documentjQuery はキャプチャ フェーズを実装していないため、javascriptaddEventListener()メソッドを使用する必要があります。

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
);
于 2015-05-27T07:16:08.353 に答える