如何将事件绑定到元素和所有子元素但只触发一次？

Question

这是 HTML 的样子：

<a href="#" id="back-button" data-transition="slide" data-direction="reverse" data-role="button">
  <div class="nav-item-desc">Back</div>
</a>

下面是我如何绑定点击事件：

$("#back-button").contents().addBack().off().on("click", function(e)
{
});

现在，当我点击 div（在文本右侧）时，事件被触发一次，当我点击 link（在按钮的文本旁边）时，它被解雇两次。

我该如何解决这个问题？

Answer 1

看看http://api.jquery.com/one/

$("#back-button").contents().addBack().off().one("click", function(e){});

Answer 2

您的代码应该是：

$("#back-button").on("click", function(e){
    // e.target is the specific clicked element
});