天天看點

關于Web中清單頁面的加載問題

      2017年5月23日,天氣晴朗。盡管昨晚睡的不踏實,好在今天心情還不是很糟糕,近來事情頗多,尤其是對于TA的改變,至少目前還是沒有習慣,但時間将會解決一切,這點深有體會。此時此刻,又想起了蘇東坡的那首詞——定風波。

    三月七日,沙湖道中遇雨。雨具先去,同行皆狼狽,餘獨不覺,已而遂晴,故作此詞。

    莫聽穿林打葉聲,何妨吟嘯且徐行。竹杖芒鞋輕勝馬,誰怕?一蓑煙雨任平生。

    料峭春風吹酒醒,微冷,山頭斜照卻相迎。回首向來蕭瑟處,歸去,也無風雨也無晴。

    最近公司做的一個項目是人事管理系統和招生管理系統,其中有資訊清單頁面展示。其實Web項目的主要功能不外乎就是增删改查,如何把增删改查等基本功能做的更優化,效率更高是我們需要考慮的問題,而不僅僅是為了實作功能而實作功能。下面就把我在做清單展示頁面中遇到的幾種加載情況簡單總結一下。

1.當DOM已經加載,并且頁面(包括圖像)已經完全呈現時,會發生ready事件。

ready()函數規定當ready事件發生時執行的代碼;ready()函數僅能用于目前文檔,是以無需選擇器。

1  //1.文法1
 2  $(document).ready(function(){   
 3           //具體程式
 4 })
 5 //2.文法2
 6  $().ready(function(){
 7           //具體程式
 8 })
 9 //3.文法3
10  $(function(){
11      //具體程式
12 })      

注意:ready()函數不應與<body onload="">一起使用。

2.使用window.onload(這個我個人用的比較多,不過在項目老大把程式又修改之後出現了一個情況——當頁面加載第一頁的時候不停地加載,但是頁面不顯示。莫着急,第三種情況就是解決這個問題的,下面就是見證奇迹的時刻......)

注意:window.onload可放在list函數後的任何一個位置。

1 function list(){
2     //具體代碼
3 }
4 window.onload=list();      

3.第三種其實就是第一種情況中的文法3,你發現了嗎?

1 function rolelist(){
2     //具體代碼
3 }
4 $(function() {
5     rolelist();
6 })