Как я могу остановить родительские события от запуска?

Question

Если у меня есть ...

<div id="parent" onmouseover="doSomething()">
    <div id="child" onmouseover="doSomethingElse()">
    </div>
</div>

Как я могу сделать так, чтобы doSomething () не выполнялся, когда я наводил курсор на ребенка? Я хочу, чтобы doSomethingElse () выполнялся только тогда, когда я наводил курсор на дочерний элемент, и я хотел, чтобы doSomething () выполнялся только когда я зависаю над родителем.

Всякий раз, когда я наводю курсор на ребенка, выполняются обе функции. Есть идеи?

Мэтт

Answer 1

Изменить значение атрибута на

onmouseover="doSomethingElse(event)"

и изменить doSomethingElse() на

function doSomethingElse(e) {
    e.stopPropagation && e.stopPropagation();
    e.cancelBubble = true;
    // ...
}

Answer 2

function doSomethingElse(e) {
// your function body

e.stopPropagation() 

}

Answer 3

Я не проверял это, но должно быть несколько способов сделать это.

Пожалуйста, проверьте всплывающее окно событий: оно отличается в IE и Firefox, но все же: www.quirksmode.org/js/events_order.html