在youTube和之间切换; Vimeo使用/ jQuery

时间:2014-11-21 06:54:56

标签: jquery iframe youtube vimeo

我有三个工作链接到youTube。用户可以单击iFrame内的文本块和URL更新。问题是,我无法让Vimeo或Twitch在第四个链接中播放。我已经尝试了所有我能想到的东西。我删除了Vimeo和Twitch链接,因为它们冗长而繁琐。我现在可以使用任何视频了。有什么建议吗?

<div class="videoHolder">
    <div id="descriptions">
    <div id= "vid1Link" class="vidDetails">
    <div id="text"><a href="http://www.youtube.com/embed/6ZDL5M0-DbM" target="someFrame">Video 1</a></div>
</div>

<div id= "vid2Link" class="vidDetails">
    <div id="text"><p><a href="http://www.youtube.com/embed/videoseries?list=PL13657A9E281737CD" target="someFrame">Video 2</a></div>
</div>

<div id= "vid3Link" class="vidDetails">
    <div id="text"><a href="http://www.youtube.com/embed/YVzkL8GuqKs" target="someFrame">Video 3</a></div>
</div>

<div id= "vid4Link" class="vidDetails">
    <div id="text" class="link4"><a href="http://www.youtube.com/embed/YVzkL8GuqKs" target="someFrame">Video 4</a></div>

</div>
</div>
<div class="videoPlayer">       
    <iframe name="someFrame" id="someFrame" width="640" height="360" frameborder="0"></iframe> 
</div>
</div>

<script>

$('.link4').click(function(){
  // ??
})
</script>

1 个答案:

答案 0 :(得分:0)

见这里:https://jsfiddle.net/fg4svu0r/1/embedded/result/

您只需提供所有资源的正确可嵌入链接。不需要JS。

<div class="videoHolder">
    <div id="descriptions">
    <div id= "vid1Link" class="vidDetails">
    <div id="text"><a href="https://www.youtube.com/embed/6ZDL5M0-DbM" target="someFrame">Video 1</a></div>
</div>

<div id= "vid2Link" class="vidDetails">
    <div id="text"><p><a href="https://www.youtube.com/embed/videoseries?list=PL13657A9E281737CD" target="someFrame">Video 2</a></div>
</div>

<div id= "vid3Link" class="vidDetails">
    <div id="text"><a href="https://www.twitch.tv/gsl/embed" target="someFrame">Video 3 - TWITCH</a></div>
</div>

<div id= "vid4Link" class="vidDetails">
    <div id="text" class="link4"><a href="https://player.vimeo.com/video/100902779?color=cc3232&api=1" target="someFrame">Video 4 - VIMEO</a></div>

</div>
</div>
<div class="videoPlayer">       
    <iframe name="someFrame" id="someFrame" width="640" height="360" frameborder="0"></iframe> 
</div>
</div>