JavaScript调整事件检测

时间:2016-05-14 19:49:07

标签: javascript mutation-observers

我写了以下代码。当通过所有可能的动作调整目标大小时,它应该被触发。我现在正在使用firefox,它也应该可以跨浏览器工作。 hick是它在firefox上不起作用。

有人可以告诉我为什么吗?可能是我不明白这些事件是如何发生的。我更喜欢非jquery解决方案。

Element.prototype.onResizeEvent = function(callBack){
    var target = this;
    target.setAttribute("data-oldHeight", target.offsetHeight); target.setAttribute("data-oldWidth", target.offsetWidth);
    var fct = function(e) {
        alert(target.getAttribute("data-oldHeight") + " " + target.offsetHeight + "\n" + target.getAttribute("data-oldWidth") + " " + target.offsetWidth);
        if (+target.getAttribute("data-oldHeight") != target.offsetHeight || +target.getAttribute("data-oldWidth") != target.offsetWidth) {
            target.setAttribute("data-oldHeight", target.offsetHeight);
            target.setAttribute("data-oldWidth", target.offsetWidth);
            callBack();
        }
    };
    try {(new MutationObserver(function() {alert(151); fct();})).observe(target, {attributes:true, childList:true, characterData:true});}
    catch(e){alert(e);}
    try {target.addEvents("DOMAttrModified propertychange", function (e) {alert(152); fct();});}
    catch(e){alert(e);}
};

addEvents是一个自定义函数,用于处理跨浏览器事件附加:

window.addEvents = document.addEvents = Element.prototype.addEvents = function(evNames, evFunction){
    if(!this.EventList)  this.EventList = [];
    evNames = evNames.split(" ");
    if(this.addEventListener) for(var i = 0; i < evNames.length; i++) if(evNames[i] != "") {
        this.addEventListener(evNames[i], evFunction, false);
        if(!this.EventList[evNames[i]]) this.EventList[evNames[i]] = []; this.EventList[evNames[i]].push(evFunction);
    }
    else if(this.attachEvent) for(var i = 0; i < evNames.length; i++) if(evNames[i] != ""){
        this.attachEvent("on" + evNames[i], evFunction);
        if(!this.EventList[evNames[i]]) this.EventList[evNames[i]] = []; this.EventList[evNames[i]].push(evFunction);
    }
    return this;
};

0 个答案:

没有答案