下划线/lodash 模板上的事件绑定答案

【问题标题】：Event binding on underscore/lodash templates下划线/lodash 模板上的事件绑定
【发布时间】：2015-06-20 17:17:33
【问题描述】：

我在 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 中有没有一种方法可以让我不必做所示的重复工作。

谢谢！

【问题讨论】：

【解决方案1】：

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

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

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

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

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

虽然上述情况应该避免。

【讨论】：