videoJs 在 JS 代碼中動態修改 src 屬性，雖然 console.log 輸出顯示修改成功，但播放的視頻並沒有切換過來
建議使用 videoJS 的 api 中的 src 方法進行修改
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>video5.0</title>
<link href="css/video-js.min.css" rel="stylesheet">
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
<script src="js/video.min.js"></script>
</head>
<body>
<div class="container">
<video id="video1" class="video-js" controls preload="auto" width="640" height="264" poster=""
data-setup='{}'>
<source src="./video/01.mp4" type='video/mp4' />
</video>
</div>
<div class="container">
<video id="video2" class="video-js" controls preload="auto" width="640" height="264" poster=""
data-setup='{}'>
<source src="./video/02.mp4" type='video/mp4' />
</video>
</div>
<div class="container">
<video id="video3" class="video-js" controls preload="auto" width="640" height="264" poster=""
data-setup='{}'>
<source src="./video/03.mp4" type='video/mp4' />
</video>
</div>
<input type="button" value="click here" id="replay">
<script type="text/javascript">
$(function() {
})
// $('#replay').click(function() {
// videojs("video1").src("./video/02.mp4");
// })
$('#replay').click(function() {
//這裏只所以取外圍 div 做循環，是因爲直接取 video 標籤或者 source 標籤，由於視頻加載的問題，偶爾會存在取不到節點問題
$('.container').each(function(index, item) {
var id = $(item).find('video')[0].id;
console.log(id);
//有三個示例視頻，這裏隨機生成 1/2/3 拼接視頻地址
var newSrc = './video/0' + (~~(Math.random() * 3) + 1) + '.mp4';
console.log(newSrc);
videojs(id).src(newSrc)
})
})
</script>
</body>
</html>