Javascript 流星事件仅绑定到第一个元素

我很难理解Meteor是如何将事件绑定添加到模板的

我有一个带有多个导航下拉列表锚的模板：

<template name="user_loggedin">
  <li  class="dropdown">
    <a href="#" class="dropdown-toggle" data-toggle="dropdown">Select a profile..
    <b class="caret"></b></a>
    <ul class="dropdown-menu">List</ul>
  </li>

  <li  class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">
      <i class="glyphicon glyphicon-cog"></i>
      <b class="caret"></b></a>
      <ul class="dropdown-menu"> </ul>
    </li>
</template>

但是，事件似乎只绑定到第一个锚元素，而不是所有与“a.dropdown-toggle”选择器匹配的锚元素

对于包含从集合派生的动态元素的模板，也会出现同样的问题。我刚才假设Meteor模板事件方法的工作方式与（…

我怀疑这与Meteor没有在绑定事件之前渲染所有模板的DOM元素有关。我见过使用Meteor.template.rendered在渲染后绑定事件的解决方案，但考虑到Meteor在下一版本中不推荐渲染方法，这似乎有点混乱

---

还有其他方法吗？

否。事件处理程序是为模板指定的，并且没有“绑定”到元素。因此，如果单击任何带有类

下拉开关的锚元素，则肯定会执行事件处理程序

您遇到的问题可能是由于在事件处理程序中使用
e.target
而不是
e.currentTarget
造成的。来自Meteor文档：

目标

引发事件的元素

currentTarget

当前正在处理事件的元素。
这是与事件映射中的选择器匹配的元素。对于
气泡事件，它可能是目标或目标的祖先，及其
值随事件气泡而更改

在第一种情况下，
e.target
和
e.currentTarget
都是
a.dropdown-toggle
，一切正常。但是，在第二种情况下，
e.target
是
i.glyphion.glyphion-cog
，而
e.currentTarget
是
a.dropdown-toggle
（这是您想要的）

因此，请尝试编辑事件处理程序，使其如下所示：

Template.user_loggedin.events({
  "click a.dropdown-toggle": function(e,tml) {
      $(e.currentTarget).siblings('.dropdown-menu').toggle()
  }
});

关于动态元素的第二个问题：您能提供一个例子吗

Template.user_loggedin.events({
  "click a.dropdown-toggle": function(e,tml) {
      $(e.currentTarget).siblings('.dropdown-menu').toggle()
  }
});