событие связывания с .live () и item.length завершается неудачно - PullRequest
Новая
       3

событие связывания с .live () и item.length завершается неудачно

0 голосов
/ 02 марта 2012

я делаю небольшую подсказку для моего сайта

у меня это отлично работает: (при наведении на пункт проверки, если существует пузырь и показывает его. Если нет, делает запрос, добавляетbuble, а затем показать его) 

$('.profileIcon').hover(function(){
    var u = $(this);
    var url = $(this).find('a').attr('href')+' #intro_usuario';

    if($(this).find('.nube').length>0){
        $(this).find('.nube').show();
    } else {
        //$('<div>').load(url).addClass('nube').css({'left':$(this).offset().left+$(this).outerWidth(true)+15,'top':$(this).offset().top}).appendTo(this).show();
        $('<div>').addClass('nube').addClass('nubeU').load(url,function(){
            $(this).css({'left':-20,'top':-16}).appendTo(u).show();
        });
    }
});

Это только сделало бы запрос и добавило бы всплывающую подсказку (.nube) div при первом наведении курсора на пользователя, в следующий раз он будет отображаться (без запроса)

Но при загрузке большего количества элементов с помощью ajax мне пришлось вспомнить его, поэтому я подумал об использовании live 

$('.profileIcon').live('hover',function(){
    var u = $(this);
    var url = $(this).find('a').attr('href')+' #intro_usuario';

    if($(this).find('.nube').length>0){
        $(this).find('.nube').show();
    } else {
       //$('<div>').load(url).addClass('nube').css({'left':$(this).offset().left+$(this).outerWidth(true)+15,'top':$(this).offset().top}).appendTo(this).show();
       $('<div>').addClass('nube').addClass('nubeU').appendTo(u).html($('#load').html()).load(url,function(){
           $(this) .css({'left':-20,'top':-16}).show();
       });
    }
});

запрос выполняется каждый раз и каждый раз, когда добавляется дополнительный пузырь

Вопрос в следующем:

¿почему if($(this).find('.nube').length>0 перестал работать, используя live?

1 Ответ

2 голосов
/ 02 марта 2012

я бы не стал тратить свое время на .live() и перейти к новой замене .on ()

.on() работает как прямая привязка к событию, но также работает как вживую. Прочитайте документацию для получения подробной информации о том, как выполнить прямую привязку и «привязывание пузыря».

попробуйте заменить .live() на .on(), они должны работать нормально.

для прямой привязки (прикрепить обработчик к элементу): 

element.on('event',function(){});

для «привязки пузыря» (обратите внимание, что element теперь является вторым параметром, а родительский объект - обработчик. Дочерний элемент будет вызван, событие переместится до родительского элемента для обработки события) 

someParentElement.on('event','element',function(){});

также вам не нужно беспокоиться о том, кто this при использовании .on(), это всегда будет элемент, который вы сработали, будь то прямой или пузырьковый.

...