ホームページ >ウェブフロントエンド >jsチュートリアル >スクロールバーのページング監視の例を実装するための jQuery スクロールイベント
スクロール イベントはウィンドウ オブジェクトで機能しますが、CSS オーバーフロー プロパティをスクロールに設定して iframe 要素でスクロールすることもできます。
$(document).ready(function () { //本人习惯这样写了 $(window).scroll(function () { //$(window).scrollTop()这个方法是当前滚动条滚动的距离 //$(window).height()获取当前窗体的高度 //$(document).height()获取当前文档的高度 var bot = 50; //bot是底部距离的高度 if ((bot + $(window).scrollTop()) >= ($(document).height() - $(window).height())) { //当底部基本距离+滚动的高度〉=文档的高度-窗体的高度时; //我们需要去异步加载数据了 $.getJSON("url", { page: "2" }, function (str) { alert(str); }); } }); });
(window).height() と (document).height() の違いに注意してください
jQuery(window).height() は現在表示されている領域のサイズを表し、jQuery(document).height()ドキュメント全体の高さを表し、特定の状況に応じて使用できます。
ブラウザ ウィンドウのサイズが変更されると (ウィンドウを最大化または拡大した後など)、それに応じて jQuery(window).height() も変更されることに注意してください。 jQuery(document) .height() は変更されません。
$(document).scrollTop() 获取垂直滚动的距离 即当前滚动的地方的窗口顶端到整个页面顶端的距离 $(document).scrollLeft() 这是获取水平滚动条的距离
一番上を取得するには、scrollTop()==0 ()のときだけ取得する必要があります。一番下までスクロールしたことがわかります
$(document).height() //是获取整个页面的高度 $(window).height() //是获取当前 也就是你浏览器所能看到的页面的那部分的高度 这个大小在你缩放浏览器窗口大小时 会改变 与document是不一样的 根据英文应该也能理解吧
実験してみると自分でわかります
$(document).scroll(function(){ $("#lb").text($(document).scrollTop()); }) <span id="lb" style="top:100px;left:100px;position:fixed;"></span><!--一个固定的span标记 滚动时方便查看-->
jQueryの詳細についてはスクロール イベントの監視を実装するスクロール バーのページネーションの例と関連記事については、PHP 中国語 Web サイトに注目してください。