js手动触发窗口resize事件

手动触发resize事件:
        function doResize(){
            setTimeout(function(){
                //手动触发窗口resize事件
                if(document.createEvent) {
                    var event = document.createEvent("HTMLEvents");
                    event.initEvent("resize", true, true);
                    window.dispatchEvent(event);
                } else if(document.createEventObject) {
                    window.fireEvent("onresize");
                }
            },100);
        }
需要调用时:
        $scope.setLiActive = function($event,areaName) {
                doResize();
        }
增加resize监听事件(局部demo):
                window.removeEventListener("resize",resizeReport,false);
                resizeReport();
                window.addEventListener("resize",resizeReport,false);
                function resizeReport() {
                    $(window).resize(function(){
                        console.log('---------------------------------------------');
                        var headerContainer = document.getElementById('zhijia-header') - 30;
                        var winHeight = $(window).height();//浏览器当前窗口可视区域高度
                        var currentActiveNum = $scope.currentActiveNum;
                        var bcs = 0;
                        bcs = Math.ceil(currentActiveNum/2);//几行
                        bcs = bcs > 2 ? 2 : bcs;//bcs每个图表之间的margin
                        var eHeight = (winHeight - (72+62+20+21*bcs)) / (bcs <= 0 ? 1 : bcs) ;
                        for(var i=0;i<currentDatas.length;i++){
                            if(currentDatas[i]['active']){
                                var id = 'zhijia_'+$scope.echartObj[tabIndex0]+'_'+currentDatas[i]['id'];
                                var div = document.getElementById(id);
                                div['style']['height'] = eHeight + 'px';
                                if(currentActiveNum == 1){
                                    div['style']['width'] = headerContainer.clientWidth + 'px';
                                }
                            }
                        }
                    });
                }
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  •   JavaScript 与 HTML 之间的交互是通过事件实现的。   事件,就是文档或浏览器窗口中发生的一些特...
    霜天晓阅读 8,895评论 1 11
  • 本节介绍各种常见的浏览器事件。 鼠标事件 鼠标事件指与鼠标相关的事件,主要有以下一些。 click 事件,dblc...
    许先生__阅读 7,539评论 0 4
  • 资源事件 beforeunload 事件 beforeunload事件在窗口、文档、各种资源将要卸载前触发。它可以...
    oWSQo阅读 3,848评论 0 1
  • JavaScript 与 HTML 之间的交互是通过事件实现的。事件,就是文档或浏览器窗口中发生的一些特定的交互瞬...
    LemonnYan阅读 3,938评论 0 4
  • 1. Vue 实例 1.1 创建一个Vue实例 一个 Vue 应用由一个通过 new Vue 创建的根 Vue 实...
    王童孟阅读 4,626评论 0 2

友情链接更多精彩内容