2025-02-10

 

今天需要做一個異步鼠標滾動加載,以前做瞭幾個,但是全部都是純js寫出來的而且也不記得放到那個文件還是項目中去瞭(本人懶得整理)。

            本來打算自己寫再寫一個,正準備動手時,突然發現,我很悲慘,那個鼠標滾動事件不記得是哪個瞭[老瞭,記性差],隻好百度或者谷歌一下啊!這一查倒是查到方法瞭,

            不過附帶瞭發現瞭很多可以直接用的插件例如:jquery.endless-scroll,paulirish-infinite-scroll很多很多啊~多的自己都不好選那個瞭。最後本人還是懶得想瞭直接自己再寫一個吧

            強大的jquery中有個一個scroll的方法,文檔中介紹和說明是這樣的啊!

            “在每一個匹配元素的scroll事件中綁定一個處理函數。當滾動條發生變化時觸發”關鍵是後面一句,滿足條件暫時就用它瞭

            這個dome我就拿window對象來做[本人開發需要]

www.aiwalls.com

 1 $(document).ready(function () { //本人習慣這樣寫瞭

 2                 $(window).scroll(function () {

 3                     //$(window).scrollTop()這個方法是當前滾動條滾動的距離

 4                     //$(window).height()獲取當前窗體的高度

 5                     //$(document).height()獲取當前文檔的高度

 6                     var bot = 50; //bot是底部距離的高度

 7                     if ((bot + $(window).scrollTop()) >= ($(document).height() – $(window).height())) {

 8                         //當底部基本距離+滾動的高度〉=文檔的高度-窗體的高度時;

 9                         //我們需要去異步加載數據瞭

10                         $.getJSON("url", { page: "2" }, function (str) { alert(str); });

11                     }

12                 });

13             });

補充一下 在外包定義一個var scrollH = 0; //上次滾動的位置記錄

並且那個判斷應修改成(bot + $(window).scrollTop()) >= ($(document).height() – $(window).height()) && $(window).scrollTop() > scrollH

可能會更好

其實,這篇文章可能沒什麼好寫的,唯一有一丁點價值就是說明那個$(window).height()和$(document).height()的區別。

            對瞭,補充一句$(window).scrollTop()和$(document).scrollTop()是沒什麼區別的,至少我在IE8中沒發現是不一樣的.

新發現一個問題,我的這個滾動方法不知為什麼會執行兩次,求助大傢啊~~

  摘自 明天的天亮

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *