jQuery .live () взаимодействия события
Скажем, у меня есть сценарий, где у меня есть глобальный плагин (или по крайней мере плагин, который связывает с более широким массивом событий).
Этот плагин берет селектор и связывает живой щелчок с ним. Что-то в псевдоjQuery, который мог бы быть похожим на это:
$.fn.changeSomething = function(){
$(this).live("change", function(){ alert("yo");});
}
На другой странице у меня есть дополнительная живая привязка чего-то вроде этого:
$("input[type='checkbox']").live("click", function(){alert("ho");});
В рамках этого сценария флажок идеально закончил бы тем, что был связан с обеими прямыми трансляциями.
То, что я вижу, - то, что событие изменения стреляет, как оно должно, и я предупрежден "эй". Однако с помощью этого живого события щелчка, я никогда не инициировал его. Однако с помощью явной привязки щелчка, я ДЕЙСТВИТЕЛЬНО поражаю его.
Легкое обходное решение должно инициировать событие щелчка в конце живого обработчика изменений, но это кажется janky мне. Какие-либо идеи?
Обратите внимание, что это использует jQuery 1.4.2 и только происходит в IE8 (я предположил, что 6/7 будет также, но я не протестировал их).
пример (Вам будет нужен jquery-1.4.2.min.js):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<script src="jquery-1.4.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$.fn.changeSomething = function(){
var t = $(this);
t.live("change", function(){
alert("yo");
});
};
$(document).ready(function(){
$("input[type='checkbox']").changeSomething();
$("#special").live("click", function(){
alert("ho");
});
});
</script>
</head>
<body>
<form>
<input type="checkbox" id="cbx" />
<input type="checkbox" id="special" />
</form>
</body>
</html>
2 ответа
Вы знаете, что IE не будет запускать событие "change", пока флажок не потеряет фокус, верно?
edit , а я думаю, что это правда, эффект от этой тестовой страницы довольно странный. Я все еще играю с этим. «Живой» механизм меня смущает и заставляет немного нервничать, хотя я прекрасно понимаю его ценность.
Я разместил (слегка измененную и уточненную) тестовую страницу: http://gutfullofbeer.net/clicks.html и собираюсь начать отладку jQuery
сумерки zone: Как отмечалось в комментариях, когда я привязываю фиктивный обработчик «изменения» к элементу body:
$('body').bind('change', function() { return true; });
, тогда все начинает работать нормально. Я уверен, что @Alex прав, что что-то происходит с тем, как jQuery пытается имитировать всплытие события «изменения». Тем не менее, все еще жутко. Тестовая страница находится по адресу http://gutfullofbeer.net/clicks-body.html , и вы можете увидеть странность, щелкнув «Сначала установить с обработчиком изменений», затем установите флажки и обратите внимание, что значок « щелкните "обработчик" на втором срабатывает только один раз, затем щелкните "Привязать обработчик к телу" и посмотрите, как после этого ведут себя флажки.
Попробуйте использовать $. delegate с общим предком вместо $.live
Главное помнить о live, что событие не привязано к выбранному вами элементу. Оно привязано к документу, а затем, когда событие переходит в документ, оно проверяет селектор, который вы передали в цели события.
Ключевым моментом здесь является то, что в IE событие изменения не "лопается" естественным образом, как в большинстве браузеров. В IE событие "пузырится" на основе эвристики, которая работает так же во всех тестах jquery, как и фактическое событие в других браузерах. Скорее всего, в вашей другой функции есть что-то, что мешает этой эвристике работать. Поэтому логично, что она специфична для IE. Не то чтобы это было хорошо...