javascript - 通过关闭无法停止/暂停灯箱中的嵌入式youtube视频(youtube api)

Question

我正在使用灯箱，用户可以在其中观看视频。
问题是，如果我通过在容器外部单击来关闭它，则会收到错误“无法读取未定义的属性'stopVideo'”，但是如果我使用按钮将其关闭，则效果很好。

$(function(){
var appendthis =(“在jsfiddle上查找”)；
$('a [data-modal-id]')。click(function(e){
$(window).resize();
e.preventDefault();
$(“body”)。append(appendthis);
$(“。modal-overlay”)。fadeTo(500，0.7);
var modalBox = $(this).attr('data-modal-id');
$('＃'+ modalBox).fadeIn($(this).data());

$(“。js-modal-close-vid，.modal-overlay”)。click(function(){
var player = $(this).closest('。modal-box')。data('player');
player.stopVideo();
$(“。modal-box，.modal-overlay”)。fadeOut(500，function(){
$(“。modal-overlay”)。remove();
});
});

});



JsFiddle发表评论。

Answer 1

$(".js-modal-close, .modal-overlay").click(function() {
  var player = $('.modal-box').data('player');
  player.stopVideo();
  player.seekTo(0);
  $(".modal-box, .modal-overlay").fadeOut(500, function() {
    $(".modal-overlay").remove();
  });
});

所做的更改是将$(this).closest('.modal-box').data('player');更改为$('.modal-box').data('player')，并且可以正常工作。我认为这里的问题是对closest方法的错误使用以及选择器不是您所期望的。

http://jsfiddle.net/4f5dksj5/6/