Javascript 如何在闭包作用域中传递事件处理程序
我正在尝试将事件处理程序添加到我的作用域中。addEvent函数工作正常。但如果我像这样将函数传递给处理程序:Javascript 如何在闭包作用域中传递事件处理程序,javascript,scope,event-handling,dom-events,Javascript,Scope,Event Handling,Dom Events,我正在尝试将事件处理程序添加到我的作用域中。addEvent函数工作正常。但如果我像这样将函数传递给处理程序: this.addEvent(window, "resize", self.resizeAd(this)); 该函数将不会传递给eventHandle未定义的事件,我不知道为什么 这是我的密码: (function(window, document, undefined) { 'use strict'; var adTech = window.adTech = {
this.addEvent(window, "resize", self.resizeAd(this));
该函数将不会传递给eventHandle未定义的事件,我不知道为什么
这是我的密码:
(function(window, document, undefined) {
'use strict';
var adTech = window.adTech = {
get: function() {
return _instance;
},
//Main entry point.
init: function(options) {
return _instance || new ADTECH(options);
}
};
var ADTECH = function(options) {
var defaultOptions = {
adID : '5202402',
hiddenClassName : 'hidden'
};
this.options = this.extend(options, defaultOptions);
this.makeAd();
_instance = this;
return _instance;
}
ADTECH.prototype = {
extend: function(source, target) {
if (source == null) { return target; }
for (var k in source) {
if(source[k] != null && target[k] !== source[k]) {
target[k] = source[k];
}
}
return target;
},
log: function(msg){
if(window.console){
console.log(msg);
}
},
debounce: function(func, wait, immediate) {
var timeout;
return function() {
var context = this, args = arguments;
var later = function() {
timeout = null;
if (!immediate) func.apply(context, args);
};
var callNow = immediate && !timeout;
clearTimeout(timeout);
timeout = setTimeout(later, wait);
if (callNow) func.apply(context, args);
};
},
addEvent: function (elem, type, eventHandle) {
console.log("adEvent is undefined: ",eventHandle);
if (elem == null || typeof(elem) == 'undefined') return;
if (elem.addEventListener) {
elem.addEventListener(type, eventHandle, false);
} else if (elem.attachEvent) {
elem.attachEvent("on" + type, eventHandle);
} else {
elem["on" + type] = eventHandle;
}
},
// Function to resize div ad to take the full space we need / get
resizeAd : function(this){
this.log("resizeAd done.");
var ad = document.getElementById(this.options.adID);
this.log(ad);
// do not work
// this.debounce(function() {
// console.log("tat:");
// }, 250)
},
// insert ad
makeAd: function () {
this.addEvent(window, "resize", this.resizeAd(this));
var self = this;
//also do not work
this.addEvent(window, "resize", self.resizeAd(this));
}
}
// Singleton
var _instance;
}(window, document));
var API = adTech.init();
修改resizeAd函数以返回函数。在这种情况下,也不需要显式地将对象传递给方法。此外,这是一个保留字,不能用作参数
// ...
resizeAd: function(invokeLater) {
// this is explicitly set based on the calling object.
var obj = this;
var helper = function ()
obj.log("resizeAd done.");
var ad = document.getElementById(obj.options.adID);
obj.log(ad);
obj.debounce(function() {
console.log("tat:");
}, 250)
};
// if invokeLater is a falsey value do the resizing right away
// if it is truthy return helper so that it can be assigned as
// an event handler
return invokeLater ? helper : helper();
},
makeAd: function () {
this.addEvent(window, "resize", this.resizeAd(true));
}
// note that you can still call resize normally.
this.resize();
在分配事件处理程序时调用函数时,将出现eventHandle is Undefined错误
this.addEventwindow,resize,this.resizeAdthis
当返回未显式声明时,JavaScript函数隐式返回未定义。除了使用new调用函数的情况外,在这种情况下,新创建的对象将隐式返回。this.resizeAd这是一个函数调用-您没有传递函数,而是传递调用函数的结果。好的,我可以将其保存到this.addEventwindow,resize,this.resizeAd;但是现在我没有更多的途径来访问这个,比如this.logthx,它似乎可以工作。现在我有一个问题,去盎司函数没有任何错误。你有什么提示吗?是的,所以我想debounce在某个时候通过了resizeAd。试试我刚才所做的编辑,它们可能会有所帮助。请参阅顶部的代码var helper=函数{很抱歉,debounce函数将无法运行您的问题是关于分配事件处理程序,而不是调试发布的每一行代码。如果您有其他问题,请询问其他问题。