4

そのような機能をどのように実現するかについて誰かが考えていますか?私はそのような方法で2つの絶対に配置されたdivを持っています: ここに画像の説明を入力してください

そして、私がやりたいのは、div1がmouseoverおよびmouseoutイベントをリッスンし、div2がマウスクリックをリッスンすることです。div2でマウスを動かしているとき、マウスアウトイベントがdiv1でトリガーされますが、そうしたくありません。ユーザーがdiv1マウスアウトをトリガーせずにdiv2上でカーソルを移動できるようにし(div1はdiv2の後ろにあるため、実際にはユーザーはカーソルを移動しなかったため)、div2をクリックします。

私はjQueryを使用していませんが、誰かがjQueryでこれを行う方法を教えてくれ、jQueryがそのような問題をどのように処理しているかについて詳細を追加できます。

4

4 に答える 4

2

マウスアウト機能は、そのように機能することを目的としています。

次の場合に、mouseoutイベントのコールバックチェックの動作を除外できます。

event.relatedTarget != div2

rgds

編集:div2のクリックに関して、発生している可能性のあるその他の問題についてコメントしてください。ただし、問題はないと思います。

于 2012-05-23T13:22:58.167 に答える
1

絶対に配置されている場合は、div 1のmouseoutイベントでのマウスの座標を確認できます。div1の長方形内にある場合は、デフォルトの動作を防止します。つまり、mouseoutイベントのコールバック関数を呼び出さないでください。 。

于 2012-05-23T13:12:14.773 に答える
1

あなたは古典的なバブリング/キャプチャの問題に直面しています。

この記事をチェックしてください:http ://www.quirksmode.org/js/events_order.html

それは私がこれまでにできたよりずっとよくあなたの状況を説明することができるでしょう!

これがあなたを興奮させるための抜粋です:

基本的な問題は非常に単純です。要素内に要素があるとします

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

どちらにもonClickイベントハンドラーがあります。ユーザーがelement2をクリックすると、element1とelement2の両方でクリックイベントが発生します。しかし、どのイベントが最初に発生しますか?どのイベントハンドラーを最初に実行する必要がありますか?言い換えれば、イベントの順序は何ですか?

于 2012-05-23T13:20:13.040 に答える
1

div1とdiv2をネストできる場合は、IE独自のmouseenter / mouseleaveイベントをエミュレートできます。これは、標準のmouseover/mouseoutイベントよりも便利です。jQueryには、.mouseenter()および.mouseleave( )を介してそれらをエミュレートするメソッドがあります。それらの実装は、途中で役立つかもしれません。

これがデモンストレーションです:http://jsfiddle.net/kXjRM

編集:JSの代わりにCSSを使用することを検討しましたか?それらをネストして使用する場合のように

#two {
  display: none;
}

#one:hover #two {
  display:block;
}

于 2012-05-23T13:23:47.147 に答える