Как я могу использовать $(this) внутри события Fancybox onComplete?

Я пытаюсь использовать jQuery $(this) внутри события Fancybox onComplete, но у меня проблемы. Здесь мой код javascript:

$('a.iframe').fancybox({  
  centerOnScroll: true,  
  onComplete: function(){  
    var self = $(this);  
    var title = self.title;  
    alert(title.text());  
  }  
});

Я упростил приведенный выше код, чтобы получить свою точку зрения, но я действительно хотел бы использовать $(this) по нескольким причинам, в которые я не буду входить.

Документация Fancybox показывает примеры использования this вместо $(this) в своей документации, но я не видел примеров, где они использовались внутри onComplete или других событий. Я, конечно, пробовал использовать this, но безрезультатно.

Кто-нибудь знает, как я могу ссылаться на активированный элемент a.iframe с помощью $(this) или любых других средств в событии onComplete?

Edit: Я получил это для работы с помощью Blackcoat, и вот последний синтаксис, который сработал:

$('a.iframe').fancybox({
  centerOnScroll: true,
  onComplete: function( links, index ){
    var self = $(links[index]);  
    var title = self.find('.title').text();  
    alert(title); 
   }
});

Ответ 1

Bitmanic,

К сожалению, вам не повезло с помощью this, но вы все равно можете ссылаться на текущую ссылку. Определите свой обратный вызов, чтобы принять массив ссылок, выбранных jQuery в качестве его первого параметра, и индекс как второй параметр:

  $('a.iframe').fancybox({  
    centerOnScroll: true,  
    onComplete: function( links, index ){  
      var self = $(links[index]);  
      var title = self.title;  
      alert(title.text());  
    }  
  });

Здесь, как Fancybox вызывает обработчик onComplete:

if ($.isFunction(currentOpts.onComplete)) {
    currentOpts.onComplete(currentArray, currentIndex, currentOpts);
}

Они не используют Javascript call или apply для вызова этой функции как метода объекта. Другими словами, this будет ссылаться на глобальную область действия вашего приложения (т.е. Объект document), поэтому вы не можете использовать его для обращения к объекту, на который воздействует (позор на них). Вместо этого они передают три параметра для обратного вызова для указания контекста: currentArray (выделенный объект), currentIndex и currentOpts.

Ответ 2

$(this) указывает на объект Fancybox, поэтому он не указывает на элемент. Если вы пытаетесь получить целевой элемент, вы можете сделать что-то вроде этого:

var $self = $(this.element);

Ответ 3

Вот мой подход - также лучший подход:

    $(".trigger").fancybox({
        onStart: function(element){
            var jquery_element=$(element);
            alert(jquery_element.attr('id'))
        }
    });

Вы можете увидеть в действии http://www.giverose.com

Ответ 4

Выполнение чего-то подобного должно работать:

var $trigger = $('a.iframe');
$trigger.fancybox({  
    centerOnScroll: true,  
    onComplete: function(){  
        alert($trigger.attr('title'));  
    }  
});

Сохраняя $('a.iframe') в локальной переменной, вы можете получить доступ к ней в своей функции обратного вызова onComplete. Или, поместить его по-другому:

... внутренним функциям разрешен доступ ко всем локальным переменным, параметров и заявленных внутренних функций внутри их внешних Функция (ы). Закрытие формируется, когда одна из этих внутренних функций доступный вне функции в который он содержал, чтобы он мог выполняться после внешней функции вернулся. В этот момент он все еще имеет доступ к локальным переменным, параметры и внутренняя функция объявления его внешней функции. Эти локальные переменные, параметр и декларации функций (изначально) значения, которые они имели, когда внешняя функция возвращается и может быть взаимодействует с внутренней функцией.

Ответ 5

Сегодня у меня был кошмар с аналогичной проблемой. Решение, которое мы нашли, работает:

При вызове fancybox задайте функцию обратного вызова, например:

// apply fancybox
$(".someclass").fancybox({
    'transitionIn'      : 'elastic',
    'transitionOut'     : 'elastic',
    'onCleanup'     : ourclosefunction
});

то в функции обратного вызова используйте что-то вроде этого:

// callback function
function ourclosefunction(links){
    // get the div id of the fancybox container
    // (by taking data after the # from the end of the url)
    var split = links.toString().split("#");
    var divid = split[1];
}

мы обнаружили, что это работает для наших встроенных требований. Мы можем использовать div, чтобы делать любую обработку содержимого fancybox, которое нужно было делать.

Ответ 6

Вы попробовали что-то вроде этого:

$('a.iframe').click(function() {
 $.fancybox({
  centerOnScroll: true,  
  onComplete: function(){    
    var title = this.title;  
    alert(title.text());  
  }  
 });
 return false;
});

Это может быть ваше решение, хотя вам нужно писать больше с меньшим удобством.

Ответ 7

Для тех, кому нужно получить ссылку на цель ссылки в событиях Fancybox v2.x, вы можете получить ее так:

var target = $('a[href=' + this.href + ']');

например.

$('.fancybox').fancybox(
   beforeLoad : function(test) {
      var target = $('a[href=' + this.href + ']');
      // do something with link
   },
   afterLoad : function(test) {
      var target = $('a[href=' + this.href + ']');
      // do something with link                  
   }
});