2017-01-31 4 views
0

У меня есть несколько видеороликов youtube внутри содержимого вкладки Bootstrap. Я намерен приостановить событие click на вкладке Bootstrap. Что я закодирован это:Пауза видео Youtube на вкладке начальной загрузки нажмите

function stopIframeonTabClick(){ 

$('.video-nav-tab a').click(function (e) { 

var selected = $(this).parent().index(); 

    $('.video-nav-tab a').each(function(index){ 

if(index != selected){ 

    var iframe = $(".tab-content").children().eq(index).find('iframe'); 

    //console.log(iframe.attr('class')); 

    var data = {"event":"command","func":"pauseVideo","args":""}; 
    var message = JSON.stringify(data); 
    $("iframe", index)[0].contentWindow.postMessage(message, '*'); 

    } 
    }); 
}); 
};//stopIframeonTabClick() 

stopIframeonTabClick(); 

Это не работает, и я нахожу ошибку консоли:

Uncaught TypeError: Cannot read property 'contentWindow' of undefined 

Я уверен, что $("iframe", index)[0].contentWindow.postMessage(message, '*'); индекса делает неправильно, но я не могу понять, что делать.

Также проверяется в IE, где видео не воспроизводится даже из-за ошибки.

В основном я использую youtube-video.js для воспроизведения видео внутри slick slider и завернуты внутри бутстраповских содержимого вкладки

Я был бы весьма признателен, если кто-нибудь может помочь мне разобраться.

Заранее спасибо.

+0

Ваш 'stopIframeonTabClick' добавляет новый' click' событие каждый раз, когда он выполняется. Нажимайте стеки событий, не заменяя друг друга. – Justinas

ответ

1

После долгого времени R & D Я сделал это. То, что я ошибался, собирал фактический iframe в активном содержимом табуляции и активном слайдере. Мне нужно иметь фактический window DOM. Благодаря Jivings в этом answer

Я делюсь код для будущей помощи другим: -

$(window).load(function(){ 

    function stopIframeonTabClick(){ 

    $('.video-nav-tab a').click(function (e) { 

    var selected = $(this).parent().index(); 

    $('.video-nav-tab a').each(function(index){ 

    if(index != selected){ 

    var iframe = $(".video-tab-content.tab-content .tab-pane.active .slick-active .video-wrapper ").find('iframe'); 
     var iframeID = iframe.attr('id'); 
     console.log(iframeID); 
     var data = {"event":"command","func":"pauseVideo","args":""}; 
     var message = JSON.stringify(data); 
     $('#'+iframeID)[0].contentWindow.postMessage(message, '*'); 

      } 
     }); 
     }); 
    };//stopIframeonTabClick() 

stopIframeonTabClick(); 
});