onresize IE中多次執(zhí)行問題
來源:程序員人生 發(fā)布時(shí)間:2013-11-14 18:25:21 閱讀次數(shù):3202次
頁面上給window對(duì)象定義其onresize事件,在拉伸縮小窗口時(shí),其onresize方法將被執(zhí)行多次,影響頁面性能。
網(wǎng)上查了些資料,說是在ie和opera中,只要窗口的邊框移動(dòng)一個(gè)像素,resize事件就觸發(fā);而在mozilla中,只在停止對(duì)窗口的大小改變時(shí)才觸發(fā)resize 事件。
停止窗口大小改變時(shí)觸發(fā)resize事件才是比較理想的。
我覺得onresize的觸發(fā)是這樣的:按照一個(gè)很短的間隔來判斷,當(dāng)你把200*200的窗口拖到200*400的時(shí)候中間要經(jīng)過幾次resize,從而觸發(fā)幾個(gè)onresize.
要避免多次onresize觸發(fā)引起某個(gè)代碼執(zhí)行多次的不良后果,可以自己寫個(gè)函數(shù),在onresize之后間隔一個(gè)時(shí)間值(setTimeout)再調(diào)用你要執(zhí)行的代碼,通過置狀態(tài)變量判斷是否要執(zhí)行,如果兩次onresize的時(shí)間間隔小于100ms,就再setTimeout,等等看。
<script type="text/javascript">
var resizeTimer = null;
function doResize(){
alert("width="+document.documentElement.clientWidth + " Height="+document.documentElement.clientHeight);
resizeTimer=null
}
window.onresize = function(){
if(resizeTimer==null){
resizeTimer = setTimeout("doResize()",300);
}
}
</script>
生活不易,碼農(nóng)辛苦
如果您覺得本網(wǎng)站對(duì)您的學(xué)習(xí)有所幫助,可以手機(jī)掃描二維碼進(jìn)行捐贈(zèng)