¿Cómo puedo usar $ (esto) dentro del evento onComplete de Fancybox?

Estoy tratando de usar $(this) jQuery) de jQuery dentro del evento onComplete de onComplete , pero estoy onComplete problemas. Aquí está mi código de JavaScript:

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

He simplificado el código anterior para express mi punto de vista, pero en realidad me encantaría usar $(this) por varias razones que no abordaré aquí.

La documentation de Fancybox muestra ejemplos de cómo usar this lugar de $(this) dentro de su documentation, pero no vi ningún ejemplo en el que se utilizaran dentro de onComplete u otros events. Por supuesto, traté de usar this , sin mucho éxito.

¿Alguien sabe cómo puedo hacer reference al elemento desencadenado a.iframe usando $(this) o cualquier otro medio dentro del evento onComplete ?

Editar: Lo hice funcionar usando la sugerencia de Blackcoat , y aquí está la syntax final que funcionó:

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

Bitmanic,

Tristemente, no tiene suerte al usar this , pero aún puede hacer reference al enlace actual. Defina su callback para aceptar una matriz de enlaces seleccionados por jQuery como su primer parámetro y un índice como el segundo parámetro:

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

Así es como Fancybox invoca el package onComplete:

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

No están utilizando la call de Javascript o se apply para invocar esta function como método de un object. En otras palabras, this se referirá al scope global de su aplicación (es decir, el object del document ), por lo que no puede usarlo para referirse al object sobre el que se actúa (vergüenza de ellos). En su lugar, pasan tres parameters a la callback para especificar el context: currentArray (el object seleccionado), currentIndex y currentOpts .

$ (esto) apunta al object Fancybox, por eso no apunta al elemento. Si intenta get el elemento objective, puede hacer algo como esto:

 var $self = $(this.element); 

Aquí está mi enfoque, también el mejor enfoque:

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

Puedes ver en acción en http://www.giverose.com

Hacer algo como esto debería funcionar:

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

Al almacenar $('a.iframe') en una variable local, puede acceder a ella dentro de su function de callback onComplete . O, para decirlo de otra manera :

… las funciones internas tienen acceso a todas las variables locales, parameters y funciones internas declaradas dentro de su (s) function (es) externa (s). Se forma un cierre cuando una de esas funciones internas se hace accesible fuera de la function en la que estaba contenida, de modo que puede ejecutarse después de que la function externa haya retornado. En ese punto, todavía tiene acceso a las variables locales, los parameters y las declaraciones de funciones internas de su function externa. Esas variables locales, declaraciones de parameters y funciones (inicialmente) tienen los valores que tenían cuando se devolvió la function externa y pueden interactuar con la function interna.

He estado teniendo una pesadilla hoy con un problema similar. Una solución que hemos encontrado funciona:

Cuando llame a la fancybox, establezca una function de callback, por ejemplo:

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

luego en la function de callback, usa algo como esto:

 // 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]; } 

hemos encontrado que esto funciona para nuestros requisitos en línea. Podemos usar divid para hacer cualquier procesamiento del contenido de fancybox que necesite hacer.

Para aquellos que necesitan get una reference al destino del enlace en los events de Fancybox v2.x, puedes getlo así:

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

p.ej

 $('.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 } }); 

¿Has probado algo como esto?

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

Esta podría ser su solución, aunque debe escribir más con less comodidad.