javascript-events - 避免在主干事件处理程序中使用 event.preventDefault() 样板

Question

我有很多以链接开头的 Backbone.js 操作，例如

<a href="#makeCookies">Make Cookies</a>

和 Backbone.View 事件哈希，如

'click [href=#makeCookies]': 'makeCookies'

和一个事件处理函数，比如

makeCookies: function (event) {
    event.preventDefault();
    //code to make cookies
    //I have no intention of ever using #makeCookies in the URL,
    //it's just there so I can wire up the event handler properly
}

有没有一种干净的方法可以避免该样板event.preventDefault()。我想过只使用<button>标签而不是<a>标签，但这似乎不合适。

Answer 1

如果您打算丢弃它，为什么还需要具有 href 属性？只使用类名怎么样？

HTML 代码：

<a class="makeCookies">Make Cookies</a>

查看代码：

'click .makeCookies': 'makeCookies'
...
makeCookies: function (event) {
    // No need for event.preventDefault() anymore!
}

Answer 2

您可以将 prevent-default 处理程序添加到文档元素。像这样：

$(document).click(function (e) {
    if (e.target.tagName === "A") {
        e.preventDefault();
    }  
})

这当然会禁用所有由 a-tags 启动的导航，但如果您的应用程序为此提供了自定义处理，那么它应该不是问题。

如果您想让一些 a-tags '通过'，那么您可以在 prevent-default 处理程序中添加更多条件，例如检查 href 属性的值是否以 '#' 开头。