1. ホーム
  2. jquery

[解決済み] mouseover()関数とhover()関数の使い分けは?

2022-08-21 21:15:44

質問

jQueryの違いは何ですか? .mouseover().hover() 関数を使うのですか?もし、全く同じものなら、なぜjQueryは両方を使うのでしょうか?

どのように解決するのですか?

jQueryの公式ドキュメントより

  • .mouseover()

    イベントハンドラをJavaScriptのイベント("mouseover")にバインドするか、そのイベントを要素上でトリガーします。 そのイベントをトリガーします。

  • .hover() マッチした要素に1つまたは2つのハンドラ を、マッチした要素にバインドします。 が入ったときに実行されます。 が去る という要素があります。

    呼び出し $(selector).hover(handlerIn, handlerOut) は略記です。 $(selector).mouseenter(handlerIn).mouseleave(handlerOut);


  • .mouseenter()

    マウスが要素に入ったときに起動されるイベントハンドラを指定します。 または要素上でそのハンドラをトリガします。

    mouseover はポインタが子要素に移動したときにも発生します。 も発生しますが mouseenter はポインタが子要素に移動したときのみ発生します。 に移動したときのみ発生します。


この意味すること

このため .mouseover() ではなく と同じです。 .hover() と同じで、同じ理由で .mouseover() ではない と同じです。 .mouseenter() .

$('selector').mouseover(over_function) // may fire multiple times

// enter and exit functions only called once per element per entry and exit
$('selector').hover(enter_function, exit_function)