“返回假"是什么意思?做? [英] What does "return false;" do?

问题描述

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

如果我把第二个ajax代码放在return false之后，代码就不起作用了！你能解释一下为什么吗?

//处理提交表单而不重新加载页面$('#FormSubmit').submit(function(e) {//存储今天输入的数据var log_entry = $("#LogEntry").val();//阻止表单正常提交e.preventDefault();$.ajax({类型:'POST'，url: 'behind_curtains.php',数据: {logentry:log_entry},成功:函数(){警报(日志条目)；//提交后清除文本框$('#LogEntry').val("");//呈现成功文本然后淡出$("#entered-log-success").html("您的条目已被输入.");$("#entered-log-success").show().fadeOut(3000);}});//提交时在页面上打印新的日志条目$.ajax({类型:'POST'，url: '/wp-content/themes/childOfFanwood/traininglog_behind_curtains.php',数据: {log_entries_loop: 真"},成功:功能(数据){警报(数据)；$("#log-entry-container").html("");$("#log-entry-container").html(data);}});返回假；});

解决方案

我将在这里写的内容适用于 jQuery 事件，
对于普通的 javascript 事件，请阅读 @T.J.答案底部的克劳德评论

<小时>回调中的

return false 阻止了默认行为.例如，在 submit 事件中，它不会提交表单.

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

return false 等价于 event.preventDefault() + event.stopPropagation()

当然，在 return xxx 行之后存在的所有代码都不会被执行.(和我知道的所有编程语言一样)

也许你觉得这有帮助:
停止事件冒泡 - 提高性能?

<小时>

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

标记:

<form id="theForm" ><input type="submit" value="submit"/></表单></div>

JavaScript:

$('#theDiv').submit(function() {警报('DIV！');});$('#theForm').submit(function(e) {警报('表格！');e.preventDefault();});

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

现场演示

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

$('#theDiv').submit(function() {警报('DIV！');});$('#theForm').submit(function(event) {警报('表格！');返回假；//或者:event.preventDefault();event.stopPropagation();});

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

现场演示

<小时>

return false 在 vanilla javascript 事件中做了什么

<块引用>

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

I wrote a webpage where a user can enter a log entry that is stored on a database and then retrieved and printed on the page using ajax. I am still quite new to ajax and was wondering if somebody could please explain to me what does return false; do at the end of my code? and is it even necessary?

If I put the second ajax code after the return false the code does not work! can you please explain to me why?

//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;
});
​

解决方案

What I'll write here is true for jQuery events,
For vanilla javascript events read @T.J. Crowder comment at the bottom of the answer

---

return false inside a callback prevents the default behaviour. For example, in a submit event, it doesn't submit the form.

return false also stops bubbling, so the parents of the element won't know the event occurred.

return false is equivalent to event.preventDefault() + event.stopPropagation()

And of course, all code that exists after the return xxx line won't be executed. (as with all programming languages I know)

Maybe you find this helpful:
Stop event bubbling - increases performance?

---

A "real" demo to explain the difference between return false and event.preventDefault():

Markup:

<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();
});​

Now... when the user submit the form, the first handler is the form submit, which preventDefault() -> the form won't be submitted, but the event bubbles to the div, triggering it's submit handler.

Live DEMO

Now, if the form submit's handler would cancel the bubbling with return false:

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

The div wouldn't even know there was a form submission.

Live DEMO

---

What does return false do in vanilla javascript events

return false from a DOM2 handler (addEventListener) does nothing at all (neither prevents the default nor stops bubbling; from a Microsoft DOM2-ish handler (attachEvent), it prevents the default but not bubbling; from a DOM0 handler (onclick="return ..."), it prevents the default (provided you include the return in the attribute) but not bubbling; from a jQuery event handler, it does both, because that's a jQuery thing. Details and live tests here – T.J. Crowder

这篇关于“返回假"是什么意思?做?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！