5

ユーザーがページをどのように操作したかを再生できるように、DOMイベントレコーダーを構築しようとしています。ページにすべてのイベントを記録できるように、jquery.on機能を使用したいと思います。この特定の例では、スクロールイベントを記録しようとしていますが、最終的にはあらゆる種類のイベントを記録したいと思います。

これが私のJSフィドルへのリンクです。ユーザーがdivをスクロールした後、テキスト「Hello」が「Bye」に変わることを期待しています。

http://jsfiddle.net/MnpPM/

ヘレルはhtmlです

<div id="parent" style="height: 300px; width: 300px; overflow: scroll">
    <div style="height: 500px; width: 500px">
        Hello
    </div>
</div>

そしてここにjavascript

$(document).on('scroll', '*', function () { $(this).html('Bye') });
4

2 に答える 2

7

イベントはdomを介してscroll伝播しないため、デリゲートで使用することはできません。

イベントをリッスンする場合scrollは、要素に直接コールバックを追加する必要があります。

$(function() {
     $("#parent").on('scroll', function () { $(this).html('Bye') });
});
于 2013-01-30T16:43:36.077 に答える
1

t.nieseが言ったように、mouseenterとmouseleaveを使用することは、あなたや同様の要件を持つ人にとってのオプションかもしれません。私はjsfiddleコードを変更したので、読んでいる人にヒントを与えるかもしれません。 。

http://jsfiddle.net/MnpPM/30/

コードは次のとおりです。

var scrollCount = 0;
$('body').on('mouseenter','*',function(e){
    console.log('mouseenter');
    $(this).scroll(function(){
           scrollCount++;
           console.log('Current Count:'+scrollCount);
    });   
    $(this).mouseout(function() {
      $(this).unbind();
    }); 
});

動的にロードされて機能するスクロールdivに同様のコードを使用しました。

于 2014-01-20T05:12:22.657 に答える