为什么在提交事件中返回false；语句？

Question

我在想，return false;的声明到底在做什么呢？通过删除它，我可以看到页面似乎自动刷新(立即删除“翻译”，而不是离开它)，但我不理解这个机制。到底怎么回事？我不认为有必要使用HTML或JS来回答我的问题，但是如果我弄错了，请告诉我，我会把它粘贴进去。

jQuery：

$(function() {  
    $("form#translator").submit(function() {
        var englishWord = $("input#word").val();
        var translatedWord = englishToPigLatin(englishWord);

        $("#english").append(englishWord);
        $("#pig-latin").append(translatedWord);

        $("#translation").show();
        return false;
    });
});

Answer 1

来自文档 (重点雷)：

现在，当表单提交时，将通知消息。这发生在实际提交之前，因此false可以通过调用事件对象上的.preventDefault()或从处理程序返回来取消提交操作。

因此，返回false会阻止默认操作(在本例中为表单提交)，但也会阻止事件的传播。这相当于调用event.preventDefault()和event.stopPropagation()。

您似乎不知道表单是如何处理的：

提交表单时，浏览器将向表单的action属性中提供的URL发出GET或POST请求，即它将加载该URL。如果没有提供action属性，将向当前URL发出请求，这将有效地重新加载页面(但也会向服务器发送数据)。

有关更多信息，请参见MDN -发送和检索表单数据。

Answer 2

当表单是已提交时，您正在执行该函数。通过返回false，可以有效地禁用表单提交，这样页面就不会被提交到服务器。

如果您确实向服务器提交，服务器将返回新页面，您的javascript更改将确实消失，直到您再次单击submit按钮。

或者，您可以使用这个来代替返回false：

your_form.submit(function(e){
    e.preventDefault();
});

相对于：

your_form.submit(function(e){
    return false;
});

Answer 3

通过“返回false”，表单将被执行，但是您的页面不会重新加载/刷新。