Fancybox iframe dit que mon href YouTube est undefined

Question

Voici mon HTML:

<a class="video iframe" href="http://www.youtube.com/watch?v=Psk2Pq03rv0&#38;fs=1">Arbitrary text</a> 

Voici le javascript Fancybox:

<script type='text/javascript'> 
    $(document).ready(function(){ 
    $("a.video").fancybox({ 
     'href' : this.href.replace(new RegExp("watch\\?v=", "i"), 'v/'), 
     'type' : 'swf', 
     'swf'  : { 
     'wmode' : 'transparent', 
     'allowfullscreen': 'true' 
     } 
    }); 
    return false; 
    }); 
</script> 

Firebug Console dit:

this.href is undefined 
'href' : this.href.replace(new RegExp("watch\\?v=", "i"), 'v/'), 

En Résultat, en cliquant sur ce lien, l'utilisateur se déplace sur YouTube et ne déclenche pas Fancybox. Changer la ligne problématique à 'href' : this.href.replace(new RegExp("watch?v=", "i"), 'v/'), qui me semble plus correct, donne le même résultat.

Un conseil?

EDIT: J'ai ajusté mon script pour inclure uniquement les parties pertinentes à ma question.

Answer 1

tag script devrait ressembler à ceci

<script type='text/javascript'> 
$(document).ready(function(){ 
    $("a.video").click(function() { 
     $.fancybox({ 
       'padding' : 0, 
       'autoScale' : false, 
       'title' : this.title, 
       'overlayOpacity' : '.6', 
       'overlayColor' : '#333', 
       'transitionIn' : 'none', 
       'transitionOut' : 'none', 
       'centerOnScroll' : false, 
       'showCloseButton' : true, 
       'hideOnOverlayClick': false, 
       'href' : this.href.replace(new RegExp("watch\\?v=", "i"), 'v/'), 
       'type' : 'swf', 
       'swf' : { 
       'wmode': 'transparent', 
       'allowfullscreen': 'true' 
       } 
     }); 
     return false; 
    }); 
}); 
</script> 

url devrait ressembler à ceci - ajouter & fs = 1 à la fin de celui-ci

<a class="video iframe" href="http://www.youtube.com/watch?v=Psk2Pq03rv0&fs=1">Arbitrary text</a> 

Answer 2

this.href, dans ce contexte, fait référence à un document, pas l'ancre.

$("a.video").fancybox({ 
    'padding' : 0, 
    'autoScale' : false, 
    'title' : this.title, 
    'overlayOpacity' : '.6', 
    'overlayColor' : '#333', 
    'transitionIn' : 'none', 
    'transitionOut' : 'none', 
    'centerOnScroll' : false, 
    'showCloseButton' : true, 
    'hideOnOverlayClick': false, 
    'href' : this.href.replace(new RegExp("watch\\?v=", "i"), 'v/'), 
    'type' : 'swf', 
    'swf' : { 
     'wmode': 'transparent', 
     'allowfullscreen': 'true' 
    } 
}); 

est également écrit que:

var options = { 
    'padding' : 0, 
    'autoScale' : false, 
    'title' : this.title, 
    'overlayOpacity' : '.6', 
    'overlayColor' : '#333', 
    'transitionIn' : 'none', 
    'transitionOut' : 'none', 
    'centerOnScroll' : false, 
    'showCloseButton' : true, 
    'hideOnOverlayClick': false, 
    'href' : this.href.replace(new RegExp("watch\\?v=", "i"), 'v/'), 
    'type' : 'swf', 
    'swf' : { 
     'wmode': 'transparent', 
     'allowfullscreen': 'true' 
    } 
}; 
$("a.video").fancybox(options); 

l'ancre n'est pas disponible dans ce contexte.

Une option consiste à envelopper le code dans un chaque bloc

$("a.video").each(function(function(index, value)) { 
    var obj = $(value); 
    obj.fancybox({ 
     'padding' : 0, 
     'autoScale' : false, 
     'title' : this.title, 
     'overlayOpacity' : '.6', 
     'overlayColor' : '#333', 
     'transitionIn' : 'none', 
     'transitionOut' : 'none', 
     'centerOnScroll' : false, 
     'showCloseButton' : true, 
     'hideOnOverlayClick': false, 
     'href' : value.href.replace(new RegExp("watch\\?v=", "i"), 'v/'), 
     'type' : 'swf', 
     'swf' : { 
      'wmode': 'transparent', 
      'allowfullscreen': 'true' 
     } 
    }); 
});