У меня есть специфическая проблема, которую я подозреваю, может быть просто нормальное поведение, но мне нужны люди, чтобы подтвердить. Я подключаю события живого клика к числу <li> элементов, используя этот код:
$('li', $list).live("click", rightItemSingleClickEvent);
Обратите внимание, что здесь я использую бланк-селектор, чтобы подключить одно и то же событие живого клика ко всем <li> элементам в $ list, который является просто неупорядоченным списком. Я называю этот код один раз на $(document).ready(). rightItemSingleClickEvent () фактически убивает событие live click в верхней части метода. Это связано с тем, что с щелчком связана анимация, и я убиваю ее, пока анимация не происходит, чтобы повторные щелчки не возникали. Код для уничтожения клика ниже:
$(this).die("click");
После завершения анимации я снова подключаю событие click:
$notesArea.fadeIn(function() {
$listItem.live("click", rightItemSingleClickEvent);
});
Я должен отметить, что весь этот код работает нормально. Я могу выбрать элемент списка, по которому нужно щелкнуть, и он каждый раз успешно убивает и снова подключается (таким образом предотвращая дублирование кликов во время анимации). Однако моя проблема в том, что когда я думаю, что убиваю только один элемент списка (<li>), кажется, что он убивает все элементы списка, а не только этот. Поэтому, когда я щелкаю по одному элементу списка, пока его функциональность продолжает работать (я все еще могу щелкнуть), все остальные больше не могут быть нажаты. Мне интересно, связано ли это с тем фактом, что я подключаю событие live click через общее утверждение, которое охватывает все <li> одновременно.
Так, может быть, если бы мне нужно было подключить прямое событие к каждому <li> по отдельности, вместо того, чтобы просто выполнять их все с помощью одного селектора, это могло бы работать? Я просто не уверен, почему вызов die () для одного <li> также убивает всех его братьев и сестер.
Любое понимание будет оценено. Спасибо.
ПОЯСНЕНИЕ: Меня попросили опубликовать немного больше кода для rightItemSingleClickEvent. Эта функция по существу обрабатывает то, что происходит, когда пользователь щелкает элемент списка. Я имитирую щелчок и снятие клика, добавляя и удаляя классы CSS. И есть еще одно текстовое поле, которое отображается при нажатии и скрывается при снятии. Это анимация, которая должна завершиться перед повторным подключением событий живого клика. Я также должен отметить, что я использую вспомогательные функции для уничтожения и соединения событий щелчка, а handleNotes () - это функция, которая сохраняет текст в текстовом поле, когда пользователь снимает клики, и делает еще пару вещей, которые я не считаю связанные с этим вопросом. Как ни странно, мой код, тем не менее, размещен ниже:
function rightItemSingleClickEvent(ev) {
var $target = $(ev.target); // what was clicked on the item
var $clickedItem = $('#' + $(this).attr('id'));
killItemClickEvents($(this)); // kill live click event to prevent extra clicks during animation
if ($target.is('a.ui-icon-circle-close')) { // if clicking remove icon, just remove the item
removeItem($clickedItem, getLeftList());
}
else { // otherwise, handle click event
if ($clickedItem.hasClass("ui-state-default")) { // UNCLICK BUTTON LOGIC (if button is clicked)
handleNotes("hide", $clickedItem); // Hide notes box and store its contents in $(this)'s notes div
$clickedItem.removeClass("ui-state-default").addClass("ui-state-active"); // unclick button
}
else { // CLICK BUTTON LOGIC (if button is unclicked)
if ($clickedItem.siblings(".ui-state-default").attr('id') != undefined) { // if a button is already clicked
// got some stuff to do with button that was already clicked
var $prev_clickedButton = $clickedItem.siblings(".ui-state-default");
handleNotes("store", $prev_clickedButton);
// now unclick all buttons -- only one clickable at a time
$prev_clickedButton.removeClass("ui-state-default").addClass("ui-state-active");
handleNotes("toggle", $clickedItem);
}
else {
handleNotes("show", $clickedItem); // Show notes box and populate it with $(this)'s notes
}
// then click the button that was clicked (by changing its css class)
$clickedItem.removeClass("ui-state-active").removeClass("ui-state-hover").addClass("ui-state-default"); // click it
}
}
}
ОБНОВЛЕНИЕ: Что ж, я изменил свой код, чтобы связать событие щелчка с каждым элементом списка индивидуально, так как оно записано в HTML, и такое же поведение сохраняется. Я, честно говоря, просто не уверен, что происходит. Но даже без общего оператора live connect уничтожение события click для одного элемента списка убивает его для всех из них. И во всем моем коде есть только одно место, которое убивает событие живого клика, и это то, которое я разместил выше. Так что я в полной растерянности.
ОБНОВЛЕНИЕ 2: Поскольку я не смог обойти эту проблему, я изменил свой код, вместо этого проверив наличие «: анимированных» состояний, и отказался от идеи уничтожения и повторного подключения событий живого щелчка. Однако мне все равно было бы интересно узнать, почему kill () для одного элемента списка убивает их всех, даже если я назначил события живого щелчка для каждого элемента списка отдельно.