兩種頁面載入等待效果的實現

2022-05-05 09:21:10 字數 924 閱讀 9993

第一種,當開啟乙個新的頁面時,這個頁面的載入時間可能會比較長,可以用以下js實現頁面等待效果,將該js匯入載入的頁面即可使用

//

獲取瀏覽器頁面可見高度和寬度

var _pageheight =document.documentelement.clientheight,

_pagewidth =document.documentelement.clientwidth;

//計算loading框距離頂部和左部的距離(loading框的寬度為215px,高度為61px)

var _loadingtop = _pageheight > 61 ? (_pageheight - 61) / 2 : 0,

_loadingleft = _pagewidth > 215 ? (_pagewidth - 215) / 2 : 0;

//在頁面未載入完畢之前顯示的loading html自定義內容

var _loadinghtml = '重置密碼中,請等待...   

';//

呈現loading效果

document.write(_loadinghtml);

= function () ;

//監聽載入狀態改變

document.onreadystatechange =completeloading;

//載入狀態為complete時移除loading效果

function

completeloading()

}

第二種,當點選頁面等待後台操作完成的時候,如果後台處理量比較大等待時間比較長,可以用以下方法實現,該方法基於easyui,關於easyui不再贅述

function

onloading()

function

removeload()

頁面載入JS兩種方式

第一種 window.onload function 第二種 document ready function 或簡寫 function 區別 1.執行時間 window.onload必須等到頁面內包括的所有元素載入完畢後才能執行。document ready 是dom結構繪製完畢後就執行,不必等到載...

需求 實現等待載入效果

需求 實現載入等待效果,比如 彈出乙個圈圈一直轉的效果。方式一 使用系統uiactivityindicatorview 1 初始化,設定其顯示位置,時間 uiactivityindicatorview mloadingview void initloadingview 2 顯示 void show ...

VC 等待游標的兩種實現方式

有時候在做煩瑣的工作時,希望滑鼠處於忙狀態,有兩種簡單的方法來實現 1.採用api 函式,大多數採用此方法 beginwaitcursor 處理.endwaitcursor 該方法這兩個函式必須配對使用,並注意處理中提前退出的處理情況,可能乙個 beginwaitcursor 函式要對應多個 end...