ユーザーがログ エントリを入力すると、そのログ エントリはデータベースに保存され、 を使用して取得されてページに印刷される Web ページを作成しましたajax。私は にまだ不慣れなので、コードの最後にある がajax何をするのかを誰かに説明してもらえると嬉しいです。また、それは必要なのでしょうか?return false;
コードの後に 2 番目の 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;
});
ベストアンサー1
ここで書くことはjQuery イベントバニラJavaScriptイベントについては、
回答の下部にある@TJ Crowderのコメントを読んでください。
return falseコールバック内では、デフォルトの動作が防止されます。たとえば、イベントではsubmit、フォームは送信されません。
return falseバブリングも停止するため、要素の親はイベントが発生したことを認識しません。
return falseevent.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 falseバニラJavaScriptイベントで何が行われますか
DOM2 ハンドラー (
addEventListener) から false を返しても何も起こりません (デフォルトを阻止することも、バブリングを止めることもしません)。Microsoft DOM2 風ハンドラー (attachEvent) から返すと、デフォルトは阻止されますが、バブリングは起こりません。DOM0 ハンドラー (onclick="return ...") から返すと、デフォルトは阻止されますが (属性に return を含めれば)、バブリングは起こりません。jQuery イベント ハンドラーから返すと、両方が起こります。これは jQuery の機能だからです。詳細とライブ テストは、こちら –TJ クラウダー