在 Closure 上创建多个元素的侦听器答案

【问题标题】：Creating a listner to multiple elements on Closure在 Closure 上创建多个元素的侦听器
【发布时间】：2012-04-20 22:13:29
【问题描述】：

我是第一次使用Closure，在使用jQuery很久之后。

我在为从 getElementsByClass() 获得的多个对象创建侦听器时遇到问题。知道如何在关闭时做到这一点吗？

  goog.events.listen(
      goog.dom.getElementsByClass('clone'),
      goog.events.EventType.CLICK,
      function(e) {
          alert('hi');
      }
  );

上面的代码出现以下错误：

Uncaught TypeError: Object # has no method 'attachEvent'

编辑：我通过以下代码完成了这项工作。但是，我不太确定这是否是最有效的方法：

  var clone_buttons = goog.dom.getElementsByClass('clone');
  for (var i = 0; i < clone_buttons.length; i++) {
      goog.events.listen(
          clone_buttons[i],
          goog.events.EventType.CLICK,
          function(e) {
              alert('hi');
          }
       );
  }

【问题讨论】：

标签： javascript events closures

【解决方案1】：

您没有在您提供的代码中的任何地方使用闭包。如果您想要最高效的代码，那么您应该将常用属性存储在局部变量中：

var clone_buttons = goog.dom.getElementsByClass('clone');
var length = clone_buttons.length;
var events = goog.events;
var CLICK = events.EventType.CLICK;

for (var i = 0; i < length; i++) {
    events.listen(
        clone_buttons[i],
        CLICK,
        function(e) {
            alert('hi');
        }
    );
}

您可以在此处阅读有关闭包的更多信息：https://stackoverflow.com/a/12931785/783743

您可以在此处阅读有关性能提升技巧的信息：http://jonraasch.com/blog/10-javascript-performance-boosting-tips-from-nicholas-zakas

【讨论】：