У меня есть два контейнера, один из которых не генерируется, пока страница не загрузится. Сгенерированный последний (<div class=last></div>) должен появиться поверх первого. Визуально это скрывает первый. Однако я не могу заставить ".last" ответить на событие нажатия кнопки live (). Он будет реагировать на первый div, но не на последний div (опять же, div, который визуально появляется на переднем плане). Это сводит меня с ума, других событий кликов на странице нет. Для ясности вот моя страница:
<body>
<div class="first">First div</div>
<script type="text/javascript">
// This works
$('body').append($('<div/>').addClass('last').text('last div'));
//This does not
$('.last').live('click', function(e) {
alert('hello');
});
</script>
</body>
Если я заменю «.last» на «.first», это сработает, у меня не будет других событий щелчка, поэтому я не понимаю, почему распространение должно быть остановлено. Я даже назначил z-index: -1 до последнего. Это должно быть невероятно просто, есть идеи?
CSS для последнего Div:
-moz-box-shadow:0 4px 10px 0 #8B8B8B;
background-color:white;
cursor:default;
margin:0 0 0 2px;
padding:4px 0;
position:absolute;
Первый div, без CSS.
Редактировать: моя структура DOM немного сложнее, чем в примере выше. Я уверен, что div "last" виден сверху. Вот фактическая структура DOM проекта:
<div>
<button> (when button is pressed last is created)
<span>
<div>
<div class="last"></div>
</div>
</button>
</div>
<table>
<thead>
<tr>
<td><div class="first"></div></td>
</tr>
</thead>
</table>
Мне кажется, я понял это и не осознал этого, пока не разместил все свое дерево. Я чувствую себя так глупо. Div «button» останавливал распространение, так как к нему было прикреплено событие jquery-ui. По какой-либо причине в Chrome и Firefox не отображается изменение состояния (т. Е. Показывается, что кнопка нажата). Это потому, что «последний» div находится не на кнопке, а под ней. Однако, что касается событий, он остановился на кнопке. IE8, как ни странно, покажет нажатие кнопки (срабатывание события), что привело к пониманию, что это была ошибка. Я полностью забыл, что jQuery-UI был подключен к кнопке, и это может показывать div и не показывать его. Перемещение div вне кнопки решило проблему.
Было бы очень хорошо, если бы у jQuery был какой-то живой журнал, в котором вы видите весь всплывающий пузырь событий.