在jQuery CoffeeScript中绑定点击事件

Question

我正在使用Rails 3.2和CoffeeScript编程.. 在我的应用程序中使用jQuery Mobile时有些疑惑。 我的HTML代码如下：

<a href="#" data-item=12 data-status=true class="follow">
  <span class="ui-btn-inner">
    <span class="ui-btn-text">
      Follow
    </span>
  </span>
</a>

在我的coffeescript中，我正在尝试在点击"Follow"按钮时编写一个函数，并尝试发送一个ajax调用。

当我这样写时：

  $("a.follow").unbind('click').bind 'click', (event, data) ->
      event.stopPropagation()
      clickedEl = $(event.target)
      console.log(clickedEl)

Console.log有时会打印带有"class"属性为"ui-btn-text"的元素，有时会打印带有"class"属性为"ui-btn-inner"的元素。

但在我的coffeescript函数中，我需要实际上从一个标签中取出属性。如何继续进行？

- useranon

Answer 1

你可以使用 event.currentTarget 代替 event.target:

在事件冒泡阶段内的当前DOM元素。

示例: http://jsfiddle.net/ambiguous/gdzUC/

或者使用 event.delegateTarget:

当前调用的jQuery事件处理程序所附加的元素。

示例: http://jsfiddle.net/ambiguous/UhBWM/

你也可以使用 closest:

clickedEl = $(this).closest('a')

示例：http://jsfiddle.net/ambiguous/2LHp3/

event.target的值是：

触发事件的DOM元素。

换句话说，它是实际被点击的东西。而currentTarget和delegateTarget则将是绑定事件的对象。对于这个问题，使用closest也许有点过度，通常您会使用它来向上遍历DOM以查找包含您要交互的多个项的容器。

- mu is too short

Answer 2

你可以使用jQuery来始终获取链接元素，这样你就有一个参考点，如果需要从包含的span中获取信息。

...
  clickedEl = $(event.target)
  parentLink = clickedEl.parentsUntil $("a.follow")
  console.log(parentLink)

- francpaul

---

啊，你说得对，parentsUntil函数不包括匹配的元素。closest是正确的函数要使用。 - francpaul