0

リンクの選択からビデオのソースを変更しようとしています。そのため、ページでリンクを選択すると、動画のオーバーヘッドがプレイリストのような別の動画のソースに変更されます。これは私のhtmlのコードです

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/    DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Videos</title>
<link rel="stylesheet" href="VideosPage.css">


<script src="jquery-1.7.2.min.js" type="text/javascript"> </script>
<script type="text/javascript">

</script>

<video id="first_video" width="800" height="450" controls="controls" style="margin-left:380px;  padding:10px; border:1px solid black;">

<source src="video.mp4" type="video.mp4" />

</video>

 <br />


  <a> Other Video  </a>
4

3 に答える 3

1

HTML標準を確認してください： http ：//www.whatwg.org/specs/web-apps/current-work/#video 。

使用できるソリューションがいくつかあります。1つは、再生リストのように、次の動画を順番に読み込んでいます。

<script type="text/javascript">
var nextVideo = "path/of/next/video.mp4";
var videoPlayer = document.getElementById('video');
videoPlayer.onend = function(){
    videoPlayer.src = nextVideo;
}
</script>
<video id="videoPlayer" src="path/of/current/video.mp4" autoplay autobuffer controls />

次に、それを変更するためのリンクを作成するのは、次のように簡単です。

$("a.change_link").click(function(){
    videoPlayer.src = nextVideo;
});
于 2012-05-18T01:38:48.580 に答える
0

<source src="video.mp4" type="video.mp4" />type = "video.mp4"の行が間違っているため、このタイプの値をここに配置することはできません

これがタイプのいくつかの例です：video / mp3、video / ogg、video/wbem。

于 2012-05-18T01:41:06.090 に答える
0

求めていることを実現するために、リンクのaltなどにビデオパスを貼り付けると、それを参照して、簡単なjqueryを使用してonclickでビデオのsrcに貼り付けることができます。

変更されたhtml：

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Videos</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<link rel="stylesheet" href="VideosPage.css">
<script src="jquery-1.7.2.min.js" type="text/javascript"> </script>
<script type="text/javascript">

</script>
<video id="first_video" width="800" height="450" controls="controls" style="margin-left:380px;  padding:10px; border:1px solid black;">
<source src="video.mp4" type="video/mp3" />
</video>
 <br />
 <a alt="video2.mp4" id="other"> Other Video </a>​

いくつかのjquery：

$('#other').click( function() { 
$('#first_video').children('source').attr('src',$(this).attr('alt'))
});​

于 2012-05-18T01:43:20.167 に答える