いつ、なぜJavaScriptで「falseを返す」のですか?


回答:


88

多くの場合、などのイベントハンドラーでonsubmitfalseを返すことは、実際に発生しないようにイベントに通知する方法です。したがって、onsubmitこの場合、これはフォームが送信されないことを意味します。


10
これは、ページをリロードせずに送信するAJAXフォームが必要な場合に特に便利ですが、JavaScriptが使用できないときにページを送信してリロードすることでも機能します。
Dean Rather

10
falseを返すことは、実際には、イベントハンドラーを作成するときにデフォルトのアクションを防止するための過剰であり、脆弱なコードにつながる可能性があります。ダグラスネイナー
Marquis Wang

3
jQueryでは、event.preventDefault()この機能を使用する方がよいでしょう。falseを返すことは非推奨であり、常に機能するとは限りません。
onetwopunch 2014年

1
時にはreturn false方法である、これは何も変更していますか?
フランシスココラレスモラレス2014年

@onetwopunch実際にe.preventDefault()に変更すると、名前空間のタッチイベントに基づく関数の1つに関する問題が解決しました。理由はわかりませんが、あなたは私にアイデアを与えました。ありがとう。
Garavani 2014年

69

私はあなたがしばしば「リターンfalse」を入れなければならないという事実を言及していると思います。イベントハンドラ内のステートメント、つまり

<a href="#" onclick="doSomeFunction(); return false;">...

「return false;」この場合、href = "#"で示されるように、ブラウザが現在の場所にジャンプするのを停止します。代わりに、doSomeFunction()のみが実行されます。アンカータグにイベントを追加したいが、クリックするたびにブラウザが各アンカーにジャンプしたくない場合に便利です。


3
もちろん、 'href = "#"'は悪い習慣ですが、全体的なポイントはまだ残っています:-)
Bobby Jack

4
@ vol7ron:代替は、JavaScriptを持たない人々のための代替として機能する実際のURLです。それ以外の場合は、何も起こらずにリンクをクリックするだけです。
ボビージャック

3
@ vol7ron:もちろん、すべての開発者(またはサイト所有者)が、どの程度の潜在的なユーザーベースに対応したいかを正確に決定します。しかし、このようなケースでは、より多くの人を対象とするオプションが非常に単純であるので、なぜそれを選択しないのかわかりません。また、JavaScriptを明示的に無効にすることだけが目的ではないことに注意してください。それは、その決定を課している他の誰か、JSファイルをダウンロードしているネットワークの問題、JSの1行にバグがあり、すべてが失敗する可能性があります。また、右クリックして[新しいタブで開く]が機能する場合も非常に便利です。
ボビージャック

ユーザーの1%以上です。多くの人がNoScriptなどの拡張機能を使用しています。javascriptなどを意図的にオフにする。
Sepero

@ vol7ron考慮すべきもう1つのシナリオは、「JavaScriptが壊れる」ときです(ページの上の方にある構文エラーのため)。非jsフォールバックがあると、このシナリオのセーフティネットが得られます。(Google.comはjs構文エラーのため、しばらくの間約30分間ダウンしていました!)
Alex Czarto

28

イベント伝播を停止するために使用されます。クリックイベントハンドラーを備えた2つの要素がある場合(たとえば)

-----------------------------------
| element1                        |
|   -------------------------     |
|   |element2               |     |
|   -------------------------     |
|                                 |
-----------------------------------

内部要素(element2)をクリックすると、1と2の両方の要素でクリックイベントがトリガーされます。これは「イベントバブリング」と呼ばれます。element2でのみイベントを処理する場合、イベントハンドラーはfalseを返してイベントの伝播を停止する必要があります。

もう1つの例は、リンクonclickハンドラーです。リンクフォームの機能を停止する場合。onclickハンドラーを追加してfalseを返すことができます。イベントが既定のハンドラーに伝達されないようにします。


9
この回答の最初の部分は間違っています。falseイベントハンドラーから戻ると、イベントに関連付けられたデフォルトのアクションができなくなります。呼び出しevent.preventDefault()または設定event.returnValue = false(IE)を介してこれを行うこともできます。イベントのバブリングを停止するには、電話event.stopPropagation()または設定event.cancelBubble = true(IE)を行う必要があります
クリストフ


12

「js、「return false」を使用する場合」を検索した後もこのページにアクセスしました。他の検索結果の中には、Chris CoyierのCSS-Tricksサイトで、はるかに便利でわかりやすいページがありました。「return false;」の違いです。および 'e.preventDefault();'

彼の記事の要点は次のとおりです。

function(){falseを返します。}

//等しい

function(e){e.preventDefault(); e.stopPropagation(); }

ただし、記事全体を読むことをお勧めします。

更新: return falseを使用するメリットを主張した後。e.preventDefault();の代替として。&e.stopPropagation(); この記事で概説されているように、私の同僚の1人がfalseを返すとコールバックの実行も停止することを指摘しました:jQueryイベント:Stop(Mis)Using Return False


いくつかのコードテストの後、jQueryではfunction() { return false; }IS EQUAL TO function(e) { e.preventDefault(); e.stopPropagation(); }ですが、純粋なjsでは同じではなく、 実際にfunction() { return false; }EQUAL TO function(e) { e.preventDefault(); }です。それはしません伝播を停止します。
SkuraZZ


3

より良い質問だと思います、なぜブール値の戻り値のセットを評価している場合に、true / falseを使用しないのですか?つまり、あなたはおそらくtrue / null、true / -1、その他の雑多なものを持つことができます。置き換えるJavascriptの「偽の」値ですが、なぜそれを行うのですか?


1

アンカータグからJavaScriptコードをトリガーする場合は、javascript:疑似プロトコルではなく、onclickハンドラを使用する必要があります。onclickハンドラ内で実行されるJavaScriptコードは、trueまたはfalse(またはevaluesからtrueまたはfalseへの式)をタグ自体に返す必要があります。trueを返す場合、アンカーのHREFは通常のリンクのようにたどります。falseを返す場合、HREFは無視されます。これが「falseを返す」理由です。多くの場合、onclickハンドラ内のコードの最後に含まれています。


1

return falseを使用して、何かが発生しないようにします。したがって、送信時にスクリプトを実行している場合、falseを返すと送信が機能しなくなります。




1

また、https://www.w3schools.com/jsref/event_preventdefault.aspを読むためのこの短くて興味深いリンク

定義と使用法

preventDefault()メソッドは、キャンセル可能な場合、イベントをキャンセルします。つまり、イベントに属するデフォルトのアクションは発生しません。

たとえば、次のような場合に役立ちます。

Clicking on a "Submit" button, prevent it from submitting a form
Clicking on a link, prevent the link from following the URL

注:すべてのイベントがキャンセル可能であるとは限りません。イベントがキャンセル可能かどうかを確認するには、cancellableプロパティを使用します。

注:preventDefault()メソッドは、DOMを介したイベントのそれ以上の伝播を妨げません。これを処理するには、stopPropagation()メソッドを使用します。


:使用を検討してdeveloper.mozilla.org/en-US/docs/Web/API/Event/preventDefaultを反対W3Schoolsのよう。しかし、確かな答え。
Bibberty
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.