jQueryのmouseout()とmouseleave()の違いは何ですか?
57018 次
5 に答える
105
mouseleaveイベントは、イベントバブリングを処理する方法がmouseoutとは異なります。この例でmouseoutが使用された場合、マウスポインターが内部要素の外に移動すると、ハンドラーがトリガーされます。これは通常、望ましくない動作です。一方、mouseleaveイベントは、マウスがバインドされている要素を離れたときにのみハンドラーをトリガーし、子孫はトリガーしません。したがって、この例では、マウスがOuter要素を離れたときにハンドラーがトリガーされますが、Inner要素はトリガーされません。
于 2010-11-23T16:57:20.133 に答える
18
mouseoutよりも の方が適している場合もありmouseleaveます。
たとえば、 の要素の横に表示するツールチップを作成したとしますmouseenter。setTimeoutツールチップが即座にポップアップしないようにするために使用します。mouseleave使用時にタイムアウトをクリアするclearTimeoutと、マウスが離れた場合にツールチップが表示されなくなります。これは 99% の確率で機能します。
しかしここで、ツールチップが添付されている要素がclickイベントを持つボタンであるとしましょう。また、このボタンがユーザーにconfirmまたはalertボックスのいずれかでプロンプトを表示するとします。ユーザーがボタンをクリックすると、alert発火します。ユーザーは、ツールチップがポップアップする機会がなかったほど速く押しました (これまでのところ非常に良い)。
ユーザーがalertボックスの [OK] ボタンを押すと、マウスが要素から離れます。ただし、ブラウザ ページはロックされた状態になっているため、[OK] ボタンが押されるまで JavaScript は起動しません。つまり、mouseleaveイベントは起動しません。ユーザーが [OK] を押すと、ツールチップがポップアップします (これは意図したものではありません)。
この場合の使用mouseoutは、発火するため、適切な解決策になります。
于 2011-07-12T15:54:40.350 に答える
10
jQuery API ドキュメント:
mouseout
このイベント タイプは、イベント バブリングが原因で多くの問題を引き起こす可能性があります。たとえば、この例では、マウス ポインターが Inner 要素の外に移動すると、mouseout イベントがそこに送信され、その後 Outer まで細流します。これにより、不適切なタイミングでバインドされた mouseout ハンドラーがトリガーされる可能性があります。便利な代替手段については、.mouseleave() の説明を参照してください。
上記mouseleaveの理由から設計されたカスタム イベントも同様です。
于 2010-11-23T16:59:15.443 に答える
4
イベント Mouseout は、マウスが選択した要素を離れたときにトリガーされ、マウスがその子要素から離れたときにもトリガーされます。
イベント Mouseleave 要素は、ポインターが選択された要素のみを離れたときにトリガーされます。
参考：W3School
于 2018-11-21T09:22:15.423 に答える