Cosa fa “return false”?

Ho scritto una pagina web in cui un utente può inserire una voce di registro che è archiviata su un database e quindi recuperata e stampata sulla pagina usando ajax . Sono ancora abbastanza nuovo per ajax e mi chiedevo se qualcuno potesse spiegarmi cosa return false; fare alla fine del mio codice? ed è anche necessario?

Se metto il secondo codice Ajax dopo il return false il codice non funziona! puoi spiegarmi perché?

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

Quello che scriverò qui è vero per gli eventi di jQuery ,
Per gli eventi vanilla JavaScript leggi il commento di @TJ Crowder in fondo alla risposta


return false all’interno di un callback impedisce il comportamento predefinito. Ad esempio, in un evento di submit , non invia il modulo.

return false interrompe anche il bubbling, quindi i genitori dell’elemento non sapranno che l’evento si è verificato.

return false è equivalente a event.preventDefault() + event.stopPropagation()

E, naturalmente, tutto il codice esistente dopo la riga di return xxx non verrà eseguito. (come con tutti i linguaggi di programmazione che conosco)

Forse lo trovi utile:
Arresta il bubbling dell’evento – aumenta le prestazioni?


Una demo “reale” per spiegare la differenza tra return false e event.preventDefault() :

markup:

 

JavaScript:

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

Ora … quando l’utente invia il modulo, il primo gestore è il modulo submit, che preventDefault() -> il modulo non verrà inviato, ma l’evento bolle al div, triggersndone il gestore di invio.

Dimostrazione dal vivo

Ora, se il gestore di invio del modulo annullerebbe il bubbling con return false :

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

Il div non sapeva nemmeno che c’era una sottomissione di modulo.

Dimostrazione dal vivo


Cosa return false fa in vanilla eventi javascript

return false da un gestore DOM2 ( addEventListener ) non esegue nulla (né impedisce il default né interrompe il bubbling; da un gestore Microsoft DOM2-ish ( attachEvent ), impedisce il default ma non gorgoglia; da un gestore DOM0 ( onclick="return ..." ), impedisce il default (a condizione che tu includa il ritorno nell’attributo) ma non gorgoglia, da un gestore di eventi jQuery, fa entrambi, perché è una cosa jQuery. Dettagli e prove dal vivo qui – TJ Crowder

Qualsiasi codice dopo l’istruzione return in una funzione non verrà mai eseguito. Interrompe l’esecuzione della funzione e fa passare questa funzione al valore restituito ( false in questo caso). La tua funzione è “invia” callback dell’evento. Se questo callback restituisce false , il modulo non verrà inviato in realtà. In caso contrario, verrà inviato come farebbe senza JavaScript.

In questo caso, return false; impedisce l’azione predefinita (che è il modulo che invia).

Anche se probabilmente è meglio usare e.preventDefault();

a causa di ajax non si deve presentare la propria forma nel modo normale. Quindi devi restituire false per impedire il comportamento predefinito del modulo.