jQuery. Кажется, что .live() не может быть привязан к элементу метки. Почему?

Вот мой код:

HTML:

<ul id="more-items">
   <li><label class="button">hi</label></li>
   <li><label class="button">hi</label></li>
   <li><label class="button">hi</label></li>
</ul>

Javascript:

$('ul#more-items label.button').live('click', function()
{
   alert(1);
});

Нажатие на метки не приводит к срабатыванию alert(). Похоже, что привязка .live() не влияет на элемент метки...

Если я изменю его, чтобы использовать .click() или даже .bind(), он отлично работает. Есть ли причина, по которой .live() не работает? Есть ли способ исправить это?

Причина, по которой я использую .live(), заключается в том, что ul#more-items будет считываться на страницу несколько раз, и я не хочу каждый раз запускать функцию для повторной привязки клика.


javascript jquery label bind live
person dave    schedule 04.06.2010    source источник
comment
Вы действительно не можете ожидать, что что-либо будет работать, если вы используете одно и то же значение id для нескольких элементов.   -  person Pointy    schedule 04.06.2010

Ответы (6)


arrow_upward
6
arrow_downward

Метод jQuery live() основан на воспроизведении событий (вплоть до корневого узла).

Если есть какой-либо код, который остановит всплытие события либо на label, либо на любом из его предков, live() не будет работать.

Есть ли шанс, что label или один из его предков имеет обработчик с одним из следующих?

return false;

or

event.stopPropagation();

Если это так, live() потерпит неудачу.

Соответствующие документы jQuery:

person user113716    schedule 04.06.2010
comment
Я только что наткнулся на эту проблему. К моим ярлыкам привязан плагин, который возвращает false. Причина этого в том, что функция .click() (привязанная к метке) срабатывает дважды, если не возвращается false. См.: groups.google.com/group/jquery-en/browse_thread/ нить/ - person dave; 04.06.2010
comment
Это сработает. return false; приводит к остановке всплытия, поэтому обработчик, который находится в корне дерева DOM, никогда не получает уведомления о срабатывании. Я предполагаю, что элементы добавляются динамически. Если это так, вы должны иметь возможность использовать bind вместо live при создании элементов. Тогда нет проблем. - person user113716; 04.06.2010

arrow_upward
1
arrow_downward

Идентификаторы элементов должны быть уникальными. Ваше утверждение «Причина, по которой я использую .live(), заключается в том, что ul#more-items будет считываться на страницу несколько раз ..» говорит мне, что у вас будет несколько из них:

<ul id="more-items"> 
  <!--Stuff-->
</ul>
<ul id="more-items"> 
  <!--Stuff-->
</ul>

Это будет недопустимый HTML, так как идентификатор more-items существует дважды.

person John Hartsock    schedule 04.06.2010
comment
Забыл, что читал этот UL несколько раз, когда писал HTML ›.‹ Теперь изменил его на класс. Однако это не решает проблему .live(). - person dave; 04.06.2010
comment
Селектор тоже поменял? ul.more-items label.button (изменить # на .) - person Pointy; 04.06.2010

arrow_upward
0
arrow_downward

пытаться

$('label.button').live('click', function()
{
   alert(1);
});

or 

$('ul#more-items').delegate('label.button','click', function()
{
   alert(1);
});
person Reigel    schedule 04.06.2010

arrow_upward
0
arrow_downward

Кажется, все в порядке, но ваше оповещение должно быть alert("1");

or:

переменная 1="1";

оповещение (1);

person Zuul    schedule 04.06.2010
comment
предупреждение (1) действительно. для проверки введите javascript:alert(1) в адресной строке. вы увидите, что он правильно предупреждает номер 1. - person John Hartsock; 04.06.2010
comment
@Reigel, могу я ошибаться? :( [ @John Hartsock, хм... спасибо за внимание :) ] - person Zuul; 04.06.2010
comment
@Zuul - Ну, я думаю, тебе следует .. ;) не перенапрягать мозг... ;) спать спокойно .. ;) - person Reigel; 04.06.2010
comment
@Reigel, здесь 4 утра, вчера был выходной, но я работаю с 10 утра, что составляет 18 часов программирования в предполагаемый тихий день :) (ну... пойду спать) ps: увидимся завтра;) - person Zuul; 04.06.2010

arrow_upward
0
arrow_downward

Вы можете попробовать это. Это может сработать

Изменять:

$('ul#more-items label.button').live('click', function() 
{ 
   alert(1); 
});

К этому:

$('ul#more-items label.button').unbind('click').live('click', function() 
{ 
   alert(1); 
});
person Luke101    schedule 04.06.2010

arrow_upward
-1
arrow_downward

Ваш код работает для меня. Какую версию jquery вы используете? Вы определяете javascript в функции $(document).ready?

person zaius    schedule 04.06.2010
comment
Да, у меня есть код в функции $(document).ready. Я использую: ajax.googleapis.com/ajax /libs/jquery/1.4.2/jquery.min.js - person dave; 04.06.2010