Question

我正在使用Firefox和JQuery：

以下代码简要隐藏了内容，但随后内容重新出现：

$("#calorielink").click(function() {
                $("#A").hide();
                $("#B").hide();
            });

以下代码正确隐藏内容：

$("#calorielink").click(function() {
                $("#A").hide();
                $("#B").hide();
                return false;
            });

为什么return语句有效？

Answer 1

return false在事件处理程序中为您执行以下操作：

阻止事件的默认操作。假设#calorieLink是a，则表示用户未被定向到新页面。
停止事件的传播。该事件不会冒泡DOM。换句话说，如果您将事件处理程序附加到此元素的“上游”元素，则不会通知它们该事件。
立即从您的回调函数返回。

通常，您只需要第一个（您只需要阻止默认操作）：

$("#calorielink").click(function(event) {
    event.preventDefault(); // Prevent the default action from occurring.
    $("#A").hide();
    $("#B").hide();
});

我通常建议不要在事件处理程序中使用return false。想想你想要在你的事件处理程序中发生什么，即使你确实需要return false完成的两件事，它也更有表现力：

event.preventDefault();
event.stopPropagation();

Here's很好地了解return false实际在做什么。

不包括return false或停止事件默认操作（event.preventDefault()）将导致您的代码运行和事件的默认行为也将发生。这可能就是为什么你看到代码快速运行然后效果消失的原因。

Answer 2

返回false会阻止浏览器加载使用href元素的<a>属性设置的网址。

我认为，元素链接到页面本身，因此重新加载页面。

JQuery Hide（）行为

2 个答案: