23

我编写了一个网页，用户可以在其中输入存储在数据库中的日志条目，然后使用ajax. 我还是很ajax陌生，想知道是否有人可以向我解释一下return false;我的代码末尾做了什么？甚至有必要吗？

如果我把第二个ajax代码放在代码后面就不行了return false！你能解释一下为什么吗？

//handles submitting the form without reloading page 
$('#FormSubmit').submit(function(e) {
    //stores the input of today's data
    var log_entry = $("#LogEntry").val();
    // prevent the form from submitting normally
    e.preventDefault();

    $.ajax({
        type: 'POST',
        url: 'behind_curtains.php',
        data: {
            logentry: log_entry
        },
        success: function() {
            alert(log_entry);
            //clears textbox after submission
            $('#LogEntry').val("");
            //presents successs text and then fades it out
            $("#entered-log-success").html("Your Entry has been entered.");
            $("#entered-log-success").show().fadeOut(3000);
        }
    });
    //prints new log entries on page upon submittion
    $.ajax({
        type: 'POST',
        url: '/wp-content/themes/childOfFanwood/traininglog_behind_curtains.php',
        data: {
            log_entries_loop: "true"
        },
        success: function(data) {
            alert(data);
            $("#log-entry-container").html("");
            $("#log-entry-container").html(data);
        }
    });
    return false;
});
​
4

5 回答 5

37

我将在这里写的对于jQuery 事件是正确的，
对于普通的 javascript 事件，请阅读答案底部的@TJ Crowder 评论

return false在回调内部防止默认行为。例如，在一个submit事件中，它不提交表单。

return false也停止冒泡，所以元素的父母不会知道事件发生了。

return false相当于event.preventDefault()+event.stopPropagation()

当然，该return xxx行之后存在的所有代码都不会被执行。（就像我知道的所有编程语言一样）

也许您觉得这很有帮助：
停止事件冒泡 - 提高性能？

一个“真实”return false的演示来解释和之间的区别event.preventDefault()：

标记：

<div id="theDiv">
    <form id="theForm" >
        <input type="submit" value="submit"/> 
    </form>
</div>​

JavaScript： 

$('#theDiv').submit(function() {
    alert('DIV!');
});
$('#theForm').submit(function(e) {
    alert('FORM!');
    e.preventDefault();
});​

现在...当用户提交表单时，第一个处理程序是表单提交，它preventDefault()-> 表单不会被提交，但是事件冒泡到 div，触发它的提交处理程序。

现场演示

现在，如果表单提交的处理程序将取消冒泡return false：

$('#theDiv').submit(function() {
    alert('DIV!');
});
$('#theForm').submit(function(event) {
    alert('FORM!');
    return false;   
    // Or:
    event.preventDefault(); 
    event.stopPropagation();
});​

div 甚至不知道有表单提交。

现场演示

return falsevanilla javascript事件有什么作用

从 DOM2 处理程序 ( addEventListener) 中返回 false 根本不做任何事情（既不会阻止默认值，也不会停止冒泡；从 Microsoft DOM2-ish 处理程序 ( attachEvent) 中，它会阻止默认值但不冒泡；从 DOM0 处理程序 ( onclick="return ...") 中，它会阻止默认值（前提是您在属性中包含返回值）但不冒泡；从 jQuery 事件处理程序中，它两者都做，因为这是 jQuery 的事情。详细信息和现场测试在这里 – TJ Crowder

于 2012-05-23T23:21:36.807 回答
4

函数中语句后的任何代码return都不会被执行。它停止执行函数并使该函数返回值传递（false在这种情况下）。您的功能是“提交”事件回调。如果此回调返回false，则不会实际提交表单。否则，它将像没有 JavaScript 一样被提交。

于 2012-05-23T23:24:03.597 回答
3

在这种情况下，return false;阻止默认操作（即表单提交）。

虽然它可能更好用e.preventDefault();

于 2012-05-23T23:22:14.067 回答
1

由于 ajax，您不希望您的表单以正常方式提交。因此，您必须返回 false 以防止表单的默认行为。

于 2012-05-23T23:22:39.023 回答
0

return 语句结束函数执行 这很重要。使用 return 会导致您的代码短路并立即停止执行，从而阻止下一行代码执行

于 2018-11-30T14:08:32.567 回答