Question

我正在使用GoogleMaps API进行一些工作，并创建了一个模块来保存一些自定义函数：

myFuncs = {
  doStuff: function() {
     console.log('I am doing stuff');
  },
  callStuff: function() {
     console.log('I am calling doStuff');
     this.doStuff();
  }
}

这似乎适合我需要的东西。但是当我这样做时：

google.maps.event.addDomListener(document.getElementById('myButton'), 'click', myFuncs.callStuff);

单击该按钮时出现以下错误：

Uncaught TypeError: Object #<HTMLButtonElement> has no method 'doStuff'

我在这里理解this的上下文由于绑定到Dom对象而发生了变化，但我并不完全了解正在发生的事情或如何解决它。

Answer 1

尝试在匿名函数中包装函数调用。例如：

google.maps.event.addDomListener(document.getElementById('scrollToForm'), 'click', function(){myFuncs.callStuff()});

我刚跑了这个，似乎正在发挥作用。

<小时/> EDIT

当您不使用匿名函数时回显this，表明您在上下文opf中绑定了您绑定的任何对象。从匿名函数中解雇它会将您的上下文设置为您正在调用的对象。不确定它是否是最佳方式，但确实有效。您可以显式调出对象，而不是使用this。 IE

myFuncs = {
  doStuff: function() {
     console.log('I am doing stuff');
  },
  callStuff: function() {
     console.log('I am calling stuff');
     myFuncs.doStuff();
  }
}

这在上下文中会出现任何混乱。

Javascript google maps api addDomListener更改此上下文

1 个答案: