Обработка нажатий вложенного div в javascript

Недавно встала задача по обработке событий onClick для 2-х div’ов - один вложен в другой. Пример:

Мне нужно было обрабатывать нажатия по коричневому div’у (который был вложен в синий div) так, чтобы onClick для синего div’а не срабатывал. Мне помог этот тред на javascript.ru.

Ну и вот пример:

<div id="parent" style="width: 200px;height:200px;background-color: #0000aa;">
    <div id="nested" style="width:100px; height:100px; background:#CC6600;">
    </div>
</div>
<script>
    $("#parent").click(function() {alert("parent");});

    $("#nested").bind("click", function(e) {
        alert('nested');
        stop_bubbling(e);
    });

    function stop_bubbling(e) {
        if (e.stopPropagation) e.stopPropagation();
        else e.cancelBubble = true;
    }
</script>

Тэги

Комментарии