javascript - window.onresize如何绑定多个函数

Question

window.onresize 在一个js里面已经绑定了重绘图表的事件

// 窗口缩放 重绘图表
if(window.onresize === null){
    window.onresize=function(){
        me.renderChart(me.ChartData);
    }
}else{
    console.warn('warning: window.onresize conflict !!!');
}

现在，同一个页面另一个js里面也需要绑定重绘事件，求解怎么绑定且不影响当前的，使窗口变化时同时执行两个事件

Answer 1

window.onresize = () =>{console.log(0)};
window.addEventListener('resize',() => console.log(1),false);
window.addEventListener('resize',() => console.log(2),false);

为什么不这么写？
另一个js能改的话最好也addEventListener。有兼容问题就用别的答案。
考虑ie8的话可以自己写个兼容处理，判断内部做attachEvent。

Answer 2

你可以把整个ifelse用一个函数封装起来，传入一个参数me，然后在需要用的连个地方传入对应的参数调用就可以了。你试试看，不知道对不对，因为我也不清楚你到底是想做什么

Answer 3

用jquery可以绑定多个

Answer 4

再封装个函数，拿去调用不就可以了吗，多少个函数都行啊，干嘛要绑定多个事件，这不符合逻辑。

Answer 5

非要用原生的话，给个思路：

window.resizeCallbacks = [];
window.onresize=function(){
  window.resizeCallbacks.forEach(callback=>{
    callback();
  });
}

有用jQuery的话，就直接绑定好了，它支持绑定多个会调在一个事件上。

Answer 6

function addEventOnResize(fn){
    var originFn = window.onresize
    window.onresize =function () {
        originFn && originFn()
        fn()
    }
}

addEventOnResize(function(){
console.log(1)
})
addEventOnResize(function(){
console.log(2)
})

参考《JavaScript DOM编译艺术》 第六章节中的代码片段 addLoadEvent