Метод live
в jQuery работает через делегирование событий, которое заключается в захвате всех всплывающих событий от отдельных элементов на общего предка (в вашем случае это document
).
Остановка распространения / всплеска события click происходит в элементе обработчика (который является общим предком, а не в самом элементе) и существует намного выше li
, которого вы пытаетесь избежать.
Таким образом, к моменту вызова метода stopPropagation
мы уже прошли через DOM и передали элемент li
.
По сути, это знак остановки 200 футов после пересечения.
Так что вам нужно либо использовать bind
и stopPropagation
, либо найти другое решение.
Вот пример того, о чем я говорю: http://jsbin.com/ibuxo (проверьте консоль)
Вы можете увидеть код или отредактировать его на http://jsbin.com/ibuxo/edit
Мое предлагаемое решение этой проблемы - использовать bind
вместо live
.
Это требует от вас дополнительной работы, но это не так уж и плохо.
Вероятно, вы используете live
, потому что вы добавляете новые элементы и хотите, чтобы они имели такую же функциональность. Вы должны сделать это, связав их при вводе их на страницу. Вот пример
$(function(){
var myAnchorHandler = function(e){
alert('clicked!');
e.stopPropagation();
return false;
};
// initial bind
$('#somelist li a').click(myAnchorHandler);
// code where you input more li elements to the list with links
$('#somelist').append(
// bind your function to the element now, and then append it
$('<li><a>hi</a></li>').find('a').click(myAnchorHandler).parent()
);
});