Я хотел бы изменить селектор "на лету" делегированного события.
Например,
Я использую этот HTML:
<div id="div1">DIV1</div>
<div id="div2">DIV2</div>
<textarea id="result"></textarea>
я делегировать событие click для всех DIV:
$(document).on("click", "div", function () {
$("#result").append(this.id + ' DIV click\r\n');
});
Позже мне нужно развязать конкретный DIV. Я мог связать новое делегированное событие, исключая этот конкретный DIV, и отменить предыдущее делегированное событие. Однако, в моем случае, я хотел бы сохранить предыдущее событие как это и просто изменить селектор этого события, то есть изменить event.selector
делегированного события "на лету".
Это событие:
var delegatedEvent = $._data(document, "events").click;
Так, пытаясь исключить DIV путем ориентации его атрибут ID (класс, и т.д...) работает, я могу использовать, например, для исключения #div2
:
delegatedEvent[0].selector += ":not(#div2)"; // => selector == 'div:not(#div2)'
По какой-то причине я не могу настроить целевой элемент с помощью определенного атрибута, мне нужно использовать индекс элемента:
var indexDiv2 = $(delegatedEvent[0].selector).index($("#div2")); // => 1
Теперь попытка исключить # div2 с использованием его индекса не работает:
delegatedEvent[0].selector += ":not(:eq("+indexDiv2 +"))"; // => selector == 'div:not(:eq(1))'
Похоже, что сопоставленный набор переоценен (???), если я использую #div1
index (0), это исключает все DIV.
Я застрял здесь, нужно использовать индекс для таргетинга на определенный DIV, но не могу использовать его для изменения делегированного селектора событий.
Любая идея, как это исправить или какая-либо известная причина этого неожиданного поведения?
PS: я мог бы использовать собственный data-*
(индекс data-), но все еще задавался вопросом, почему использование :eq()
не работает...
Почему бы не обработать его динамическим классом?
$(document).on("click", "div:not(.exclude)", function () {
$("#result").append(this.id + ' DIV click\r\n');
});
И просто добавьте exclude
класса в exclude
элементы? Когда ты хочешь это.
delegatedEvent[0].selector += ":not(.exclude_"+delegatedEvent[0].guid+")";
delegatedEvent[0].selector
div
из которогоdelegatedEvent[0].selector
, так как только у одногоdelegatedEvent[0].selector
div
произошло событие? Таким образом:eq(0)
и:first
всегда верно?$(document).on("click", "div:not(:eq(1))", handler)
исключает второй DIV, так почему бы не изменить свойство селектора событий? Мне было интересно, чтобы селектор "div: not (: eq (1))" переоценивался при каждом вызове, и, похоже, это так