如何在弹出窗口中播放YouTube视频？

我想创建一个弹出窗口，将播放YouTube视频。但我不知道，由于某种原因，它不会发生。我已经包含了我尝试过的代码。我正在尝试在wordpress中使用它。如何在弹出窗口中播放YouTube视频？

<a href="http://www.youtube.com/v/2cxqZiWyW3g&hl=en_US&fs=1&autoplay=1" 
class="video-link">Video 1</a> 
<a href="http://www.youtube.com/v/607RMNoJfl4&hl=en_US&fs=1&autoplay=1" 
class="video-link">Video 2</a> 

<div class="modal" id="video-modal"> 
    <div id="video-container" style="width: 425px; height: 344px;"></div>

<script language="javascript" type="text/javascript"> 
    $(function() { 
    var videoModal = $('#video-modal').overlay({ 
     expose: { 
      color: 'black', 
      loadSpeed: 200, 
      opacity: 0.85 
     }, 
     closeOnClick: true, 
     api: true 
    }); 

    $('.video-link').click(function() { 
     videoModal.load(); 

     var videoUrl = $(this).attr('href'); 
     var flashvars = {}; 
     var params = { 
      allowFullScreen: "true", 
      allowscriptaccess: "always" 
     }; 
     var attributes = {}; 

     swfobject.embedSWF(videoUrl, 'video-container', '425', '344', '9.0.0', '', flashvars, params, attributes); 

     return false; 
    }); 
});

有人可以纠正我在哪里，我错了。点击该链接即可看到YouTube视频。

来源

2015-11-02 Stephen Rodriguez

任何错误讯息？ – vard

尝试增加preventDefault()您点击

$('.video-link').click(function(e) { 
    e.preventDefault(); 
... 
});

来源

2015-11-02 09:33:45

'return false;'应该达到相同的效果 - 它相当于'e.preventDefault（）'和'e.stopPropagation（）' – vard

要在弹出的添加视频，你也可以在你的情况下使用

http://www.youtube.com/embed/(ID of video)?parameters

<a href="http://www.youtube.com/embed/2cxqZiWyW3g?autoplay=1" 
class="video-link">Video 1</a>

我创建codepen它，请检查它 http://codepen.io/unmeshdusane/pen/WQKvPQ

来源

2015-11-02 10:00:26 UnmeshD

您可以使用此

你的链接

<a href="#play" onclick="popupYT('2cxqZiWyW3g')">Video 1</a> 

<a href="#play" onclick="popupYT('607RMNoJfl4')">Video 2</a>

和脚本

<script> 
    function popupYT(id) { 
    window.open('https://www.youtube.com/embed/'+id, 'popup', config='height=375,width=450') 
    } 
    </script>

非常简单，在控制台工作

来源

2016-12-06 23:55:43

如何在弹出窗口中播放YouTube视频？

回答

相关问题