Проблема триггера Jquery

Question

У меня есть два элемента DIV. HTML выглядит так:

<div id="first"><div id="second"></div></div>

CSS для этого элемента:

#first{ float:left; width:656px; border-bottom:1px solid #CCC; padding-top:5px; display:block; cursor:pointer;}
#second{ float: right; margin-right:10px;  border:1px solid #9F0; width:230px; height:14px; background-color:#FF0; display: none;}

Код запроса:

$(document).ready(function(){
    $("#first").click(function(event) {
        $("#third").load('index.php');
    });
});

$("#first").live('mouseover', function() {       
    $("div#second").show();
});

$("#second").live('click', function() {       
    $("#fourth").load('somepage.php');
});

То, что я хочу сделать, - это когда при наведении курсора на первый DIV запускается функция, а второй DIV появляется внутри первого DIV, пользователь может нажать на второй DIV и открыть «somepage.php». Используя этот код, функция Jquery для второго DIV покрывается блоком отображения CSS первого DIV, и оба Jquery запускаются.

Как я могу приостановить функцию щелчка Jquery первого DIV при запуске второй функции DIV?

Answer 1

Если вы не используете live (т.е. вместо этого используете click / bind) для обработчика второго клика, вы можете просто вернуть false из обработчика или вызвать event.stopPropagation ().

Другим решением является проверка в обработчике первого нажатия div на event.target.id, чтобы увидеть, на что нажали.

Answer 2

Вы можете использовать unbind:

.

$ ( "# первый") отвязать ( "MouseOver");

Я думаю, что это работает, хотя проверьте документацию jquery: http://docs.jquery.com/Events/unbind