google-closure - 如何使用单个事件节点将事件分配给多个子 DOM 元素？

Question

在我的 Google Closure 代码中，我想为 div 中的每个跨度分配一个事件。

HTML:

  <div id="container">
    <span>foo</span>
    <span>bar</span>
    <span>bacon is delicious</span>
  </div>

关闭Javascript:

  var container = goog.dom.getElement('container');
  var spans = goog.dom.getChildren(container);
  for (var i = 0; i < spans.length; i++) {
    eventHandler.listen(
        spans[i],
        goog.events.EventType.CLICK,
        function (e) {
          doSomeStuff(e.target);
        }
  }

这个循环看起来效率不高，因为它似乎为每个单独的 span 元素分配了一个事件节点。我能否以某种方式将单个事件节点分配给包含的 div，并在 span 上的点击事件冒泡到包含的 div 时运行回调函数？

在 jQuery 中，我相信 live() 和 delegate() 函数之间的区别与我在这里处理的问题相似。

Answer 1

我从未使用过 Google Closure，但您已经在使用 e.target。只需向容器添加一个监听器，您就可以使用 e.target 获取实际点击的元素。

var container = goog.dom.getElement('container');

eventHandler.listen(
    container,
    goog.events.EventType.CLICK,
    function (e) {
        doSomeStuff(e.target);
    });