underscore/lodash 模板上的事件绑定

Question

我在 jquery 插件中有一个示例 lodash 模板，如下所示：

<div>
    <% _.forEach(circle, function(circle, idx){%>
          <a class='circle'> <%- circle.circleName %> </a>
    <%})%>
</div>

我想将点击事件处理程序添加到 a 标签。目前，在 DOM:

上呈现上述模板后，我正在执行以下操作

$(".cricle").each(function(circle){
    $(circle).click(function(elm){
        console.log("Clicked: ", elm)
    })
})

所以，在 lodash 或 jquery 中有没有一种方法可以让我不必做所示的重复性工作。

谢谢！

Answer 1

首先，您无需遍历匹配的元素即可将相同的事件处理程序绑定到元素集合。以下应该没问题：

$('.circle').on('click', function(elm) { console.log('Clicked: ', eld); });

我很确定lodash 没有提供在模板中绑定事件处理程序的特殊方法。

您可以使用 vanilla JavaScript 在您的元素上定义内联事件处理程序。

<a class='circle' onclick="console.log('Clicked: ', this">
  <%- circle.circleName %>
</a>

虽然应该避免以上情况。

Event binding on underscore/lodash templates