如何通过已列出的播放列表播放HTML 5中的视频？

问题描述：

我有一个代码index.html像这样：我创建了样式，脚本和视频主体。如何通过已列出的播放列表播放HTML 5中的视频？

<html> 
<head> 
<title>tes video</title> 
</head> 
<style type="text/css"> 
     #playlist { 
     display:table; 
    } 
    #playlist li{ 
     cursor:pointer; 
     padding:8px; 
    } 

    #playlist li:hover{ 
     color:blue;       
    } 
    #videoarea { 
     float:left; 
     width:1280px; 
     height:720px; 
     margin:10px;  
     border:1px solid silver; 
    } 
</style> 
<script type="text/javascript"> 
     $(function() { 
      $("#playlist li").on("click", function() { 
      $("#videoarea").attr({ 
       "src": $(this).attr("movieurl"), 
       "autoplay": "autoplay" 
       "type: video/mp4" 
      }) 
     }) 
      $("#videoarea").attr({ 
      "src": $("#playlist li").eq(0).attr("movieurl"), 
     }) 
     }) 
</script> 

<body> 
    <video id="videoarea" controls="controls" src=""></video> 

    <ul id="playlist"> 
     <li movieurl="kendrickdna.mp4">Dna</li> 
     <li movieurl="kendrickhumble.mp4">Humble</li> 
    </ul> 
</body> 
<html>

我想在我的html中创建一个简单的播放列表视频，但视频不出现，我错了什么？在此先感谢

答

语法错误在这里：“type：video/mp4”。

它应该是“type”：“video/mp4”。

，你可以在这里看到的例子 - jsfiddle.net/kv9s9a0a/1

$("#playlist li").on("click", function(){ 
    $("#videoarea").attr({ 
    "src": $(this).data("movieurl"), 
    "autoplay": true, 
    "type": "video/mp4" 
    }); 
});

如何通过已列出的播放列表播放HTML 5中的视频？

相关推荐