web-dev-qa-db-ja.com

jqueryでドキュメントサイズの変更を検出する方法

したがって、何かをクリックすると新しいコンテンツが画面に読み込まれ、ドキュメントの高さが変化し、以前はスクロールバーがなかったのに対し、現在は実際にはスクロールバーがあるとします。

jqueryを使用してそのようなことが起こっていることを検出するにはどうすればよいですか？

サイズ変更イベントをウィンドウにバインドすると、ウィンドウのサイズ変更のみが検出されますが、ドキュメントにバインドすることはできません

javascriptjquerybrowserresizesize
15
kamikaze_pilot

更新：
DOMSubtreeModifiedイベントは使用しないでください。これは古く、非推奨であり、ブラウザで十分にサポートされていません。 99,9％のケースで、聞くことができる別のイベントがあります。おそらくあなたはjQueryを使用してAJAXの作業を行っている人の一人なので、彼らの AJAX docs を見てください。

これら はすべて利用可能なイベントです。 $(document).bind('DOMSubtreeModified', function() { ... });を検出し、前回の発砲に対する寸法の変更を確認する必要があります。

var height = $(this).height(),
    width  = $(this).width();
$(document).bind('DOMSubtreeModified', function() {
    if($(this).height() != height || $(this).width() != width) {
        recalibrate();
    }
});

このイベントは発生していますevery time anything DOMに対して実行されます。したがって、それはwillブラウザの速度を低下させます。

より良い代替案を取得する必要があります。シナリオについて詳しく教えてください。

18
buschtoens

これが解決策です。

// ajdust margins when page size changes (ie rotate mobile device)
$(window).resize(function() {
  // Do something more useful
  console.log('doc height is ' + $(window).height());
});
0
Nathan Sharfi