javascriptトリガーのOnmouseoutイベント

Question

.zberiLokacijaクラスのonmouseoutイベントがonmouseoutイベントによって起動されているようです（<li>）。これがJavascriptの仕組みか、私は間違ったことをしていますか？その場合はdiv要素自体を離れるときにのみ.izberiLokacijaクラスでイベントをれるonmouseoutアクティブにするために可能な解決策を提案してください...

<div class="izberiLokacija" onmouseout="alert('asd');toggleDivZaMalaMapa(2);"> 
      <ul> 
        <li onmouseover="toggleDivZaMalaMapa(1);">li1</li> 
        <li onmouseover="toggleDivZaMalaMapa(1);" style="border-top: solid 2px #00699B"> li2 </li> 
      </ul> 
</div> 

Answer 1

これは、JavaScriptが動作する方法です。各<li>にハンドラーを入れて、バブルを防ぐ（event.stopPropagation()またはfalseを返す）か、またはevent.targetが.izberiLokacijaハンドラーに含まれているかどうかをテストします。混乱を解消するイベントのバブリングについて詳しく読む。

もう1つの方法は、onmouseout/onmouseoverをonmouseleave/onmouseenterに置き換えることです。彼らはほとんど同じイベントですが、後者のペアはバブルしません。

オフトピック：alertからconsole.logに移動するともっと幸せになります。また、インラインJavaScriptは動作しにくいです。 JSとHTMLを分けることを検討してください。

Answer 2

要素の上にマウスを置くたびに、「ホバー」イベントが発生します。イベントはまた、DOMツリーをバブルアップし、その親のそれぞれのために発砲するでしょう...ボディタグまでずっと。

イベントをインラインに割り当てることは避けてください。コードを維持したり、非意味的なマークアップを膨大にしたりしないようにしてください。

（誰もがjQueryのを使用しているため、右、... jQueryのを使用して？）代わりに、これを試して

http://jsfiddle.net/ryanwheale/fab8Z/