layedit 内容变化事件_JS监听div的resize事件

需求

开发过程中经常遇到的一个问题就是如何监听一个div的size变化。

比如我用canvas绘制了一个chart，当canvas的size发生变化的时候，需要重新绘制里面的内容，这个时候就需要监听resize事件做处理。

window上虽然可以添加resize事件监听，但这并不能满足我们的需求，因为很多时候，div的size发生了变化，但是window的size并没有改变。

不过我们可以间接利用window的resize事件监听来实现对于某个div的resize事件监听，请看下面具体实现。

对于div的resize事件的监听，实现方式有很多，比如周期性检查，通过scroll事件等等，本文主要介绍通过object元素来实现监听。

具体实现

1 /**2 * Created by taozh on 2017/5/6.3 * taozh1982@gmail.com4 */

5 var EleResize ={6 _handleResize: function(e) {7 var ele = e.target ||e.srcElement;8 var trigger =ele.__resizeTrigger__;9 if(trigger) {10 var handlers =trigger.__z_resizeListeners;11 if(handlers) {12 var size =handlers.length;13 for (var i = 0; i < size; i++) {14 var h =handlers[i];15 var handler =h.handler;16 var context =h.context;17 handler.apply(context, [e]);1