onresize IE中多次执行问题

发布时间：2018-09-09 06:43:04 所属栏目：模式来源：站长网

导读：页面上给window对象定义其onresize事件，在拉伸缩小窗口时，其onresize方法将被执行多次，影响页面性能。网上查了些资料，说是在ie和opera中，只要窗口的边框移动一个像素，resize事件就触发；而在mozilla中，只在停止对窗口的大小改变时才触发resize 事件

页面上给window对象定义其onresize事件，在拉伸缩小窗口时，其onresize方法将被执行多次，影响页面性能。
网上查了些资料，说是在ie和opera中，只要窗口的边框移动一个像素，resize事件就触发；而在mozilla中，只在停止对窗口的大小改变时才触发resize 事件。
停止窗口大小改变时触发resize事件才是比较理想的。

我觉得onresize的触发是这样的：按照一个很短的间隔来判断，当你把200*200的窗口拖到200*400的时候中间要经过几次resize，从而触发几个onresize.

要避免多次onresize触发引起某个代码执行多次的不良后果，可以自己写个函数，在onresize之后间隔一个时间值(setTimeout)再调用你要执行的代码，通过置状态变量判断是否要执行，如果两次onresize的时间间隔小于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>

（编辑：云计算网_泰州站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!