为什么'回归虚假;'提交活动中的陈述?

时间:2014-01-31 07:27:10

标签: javascript jquery javascript-events

我想知道这个Pig-Latin翻译器中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;
    });
});

谢谢!

3 个答案:

答案 0 :(得分:4)

来自.submit documentation(强调我的):

  

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

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


您似乎不知道如何处理表单:

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

有关详细信息,请参阅MDN - Sending and retrieving form data

答案 1 :(得分:2)

当表单为submitted时,您正在执行该功能。通过返回false,您可以有效地禁用表单提交,这样页面就不会被提交到服务器。

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

或者你可以使用它而不是return false:

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

对战:

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

答案 2 :(得分:0)

by" return false" ,表格将被执行,但您的页面将不会重新加载/刷新。