0

想知道这是否可能。

我正在制作一个视频页面，页面顶部有一个主屏幕，主屏幕下方有一些可点击的小屏幕。所以当你点击底部的小屏幕时，主屏幕会呈现类似于youtube的点击视频。

我们从 ooyala 获得如下数据：data="http://player.ooyala.com/static/cacheable/fc6411f99c3b69d5987fcb94f4f48a94/player_v2.swf

另外，我们没有后端的php代码，所以我们只能使用javascript、jquery和html来制作页面。

所以这是我的问题。如果可能，如何使用 html5 视频标签、jquery 或 javascript 和 json 来呈现每个视频？另外，如果有人可以提供任何其他可能的解决方案或更好的解决方案，将不胜感激。提前致谢。

4

1 回答 1

2

像这样的东西应该工作......

jQuery：

$("a").click(function(){
    $(".video").html("");
    var url = $(this).data("url");
    $(".video").append("<video controls=\"controls\"><source src=\"" + url + "\" type=\"video/mp4\" class=\"video\" /></video>"); 
});​

HTML：

<div class="video">  
</div>
<a class="one" href="#" data-url="VIDEO URL ONE">One</a>
<a class="two" href="#"  data-url="VIDEO URL TWO">two</a>

示例：http: //jsfiddle.net/charlescarver/xJ6mz/1/

单击<a>链接后，它会获取其data-url属性，将其放入变量中，然后将视频播放器附加到div具有正确src.

于 2012-09-08T20:28:21.987 回答