为什么preventDefault无效但return false有效

Question

有人知道为什么我的preventDefault代码不起作用吗？返回false可以正常工作，但据我所知，这并不是真正的“正确”方法？

 if ($('.signup').length == 0) {
        $('.star').on('click',function(e){
            e.preventDefault();
            var starElement = $(this);
            var resourceId = starElement.parents('li').data('id');

            updateFavoritesSpan( starElement, starElement.hasClass('starred') );

            starElement.toggleClass('starred');
            starElement.parents('li').toggleClass('fvtd');
        });
        // voting
        $('.voting').on('click .up', function(e){
            e.preventDefault();
            sendVote($(this), 1);
        });

        $('.voting').on('click', '.down', function(e){
            e.preventDefault();
            sendVote($(this), -1);
        });
    }

- Tallboy

---

你能详细说明一下“不起作用”是什么意思吗？这些元素是什么类型的？这与ajax有什么关系？ - Pointy

所有浏览器都有这个问题还是只有某些浏览器？ - Mike Christensen

它们是锚链接。当您单击它们时，会跟随该链接。这些是Ajax请求，因此不应跟随该链接。 - Tallboy

可能是[event.preventDefault() vs. return false]的重复问题 (https://dev59.com/RXM_5IYBdhLWcg3wfTO7) - Wayne

Answer 1

return false;会同时执行preventDefault和stopPropagation。

preventDefault会阻止元素上的“默认”操作，stopPropagation会阻止事件向上冒泡到父元素。

我猜测，当你只执行preventDefault时，仍然会触发父级元素上的事件。

- gen_Eric

Answer 2

return false 和 preventDefault() 不同。

实际上，return false 是以下两个方法的结合或简写形式：

• preventDefault()
• stopPropagation()

因此，请尝试添加以下内容（与 e.preventDefault() 一起使用）：

e.stopPropagation();

- Blaster

Answer 3

有一个错别字，请更正：

$('.voting').on('click .up', function(e){

to:

$('.voting').on('click', '.up', function(e){

- Ram

Answer 4

仅供完整性参考：

return false

也会触发

stopImmediatePropagation()

，从而取消同一元素上的所有后续处理程序（在处理touchend事件并打算取消后续点击时可能会派上用场）

在此处阅读stopPropagation()和event.stopImmediatePropagation()之间的区别：
jquery: stopPropagation vs stopImmediatePropagation

- emik