简体   繁体   English

“返回假”是什么意思? 做?

[英]What does “return false;” do?

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 .我写了一个网页,用户可以在其中输入存储在数据库中的日志条目,然后使用ajax检索并打印在页面上。 I am still quite new to ajax and was wondering if somebody could please explain to me what does return false;我对ajax还是很ajax ,想知道是否有人可以向我解释什么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!如果我在return false之后放置第二个 ajax 代码,则代码不起作用! 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 ,我将在这里写的内容适用于jQuery 事件
For vanilla javascript events read @TJ Crowder comment at the bottom of the answer对于 vanilla javascript 事件,请阅读答案底部的 @TJ Crowder 评论


return false inside a callback prevents the default behaviour.在回调中return false阻止默认行为。 For example, in a submit event, it doesn't submit the form.例如,在submit事件中,它不提交表单。

return false also stops bubbling, so the parents of the element won't know the event occurred. return false也会停止冒泡,所以元素的父元素不会知道事件发生了。

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

And of course, all code that exists after the return xxx line won't be executed.当然,在return xxx行之后存在的所有代码都不会被执行。 (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() :一个“真实”的演示来解释return falseevent.preventDefault()之间的区别:

Markup:标记:

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

JavaScript: 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.现在...当用户提交表单时,第一个处理程序是表单提交,即preventDefault() -> 表单不会被提交,但事件冒泡到 div,触发它的提交处理程序。

Live DEMO现场演示

Now, if the form submit's handler would cancel the bubbling with return false :现在,如果表单提交的处理程序将取消冒泡并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. div 甚至不知道有表单提交。

Live DEMO现场演示


What does return false do in vanilla javascript events在 vanilla javascript 事件中return false做什么

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 – TJ Crowder从 DOM2 处理程序( addEventListener )返回 false 根本不做任何事情(既不阻止默认值也不停止冒泡;从 Microsoft DOM2-ish 处理程序( attachEvent ),它阻止默认但不冒泡;从 DOM0 处理程序( onclick="return ..." ),它可以防止默认值(如果您在属性中包含返回值)但不会冒泡;从 jQuery 事件处理程序中,它可以同时执行这两项操作,因为这是 jQuery 的事情。此处的详细信息和实时测试 – TJ Crowder

Any code after return statement in a function will never be executed.函数中return语句之后的任何代码都不会被执行。 It stops executing of function and make this function return value passed ( false in this case).它停止执行函数并使该函数返回值传递(在这种情况下为false )。 Your function is "submit" event callback.您的功能是“提交”事件回调。 If this callback returns false , form will not be submitted actually.如果此回调返回false ,则实际上不会提交表单。 Otherwise, it will be submitted as it would do without JavaScript.否则,它将像没有 JavaScript 一样被提交。

In this instance, return false;在这种情况下, return false; prevents the default action (which is the form submitting).阻止默认操作(即提交表单)。

Although it's probably better to use e.preventDefault();虽然最好使用e.preventDefault();

because of ajax you do not want your form to be submitted with the normal way.由于 ajax,您不希望以正常方式提交表单。 So you have to return false in order to prevent the default behavior of the form.所以你必须返回 false 以防止表单的默认行为。

The return statement ends function execution This is important. return 语句结束函数执行 这很重要。 Using return causes your code to short-circuit and stop executing immediately, preventing the next line of code from executing使用 return 会导致您的代码短路并立即停止执行,从而阻止执行下一行代码

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM