javascript Video.js更改源代码，但不显示新的源代码

baubqpgj 于 2023-03-28 发布在 Java

关注(0)|答案(5)|浏览(161)

抱歉我对这个主题缺乏了解
我有一个脚本可以改变视频播放器的源代码。它就是这样做的。唯一的问题是Video.js播放器播放分配给它的第一个源代码。

document.getElementById("vid-player_html5_api").innerHTML = "";

document.getElementById("vid-player_html5_api").innerHTML = "<source src='" + link + "' type='video/mp4'>";
document.getElementById("vid-player_html5_api").muted = false;

因此，如果有两个按钮，并且您单击 * 按钮1*，它会更改播放器的源并显示正确的视频。然后假设您单击 * 按钮2*，它会更改播放器的源，但它仍然会显示与按钮1相同的视频

它被证明改变了源代码，我检查了Chrome开发工具，肯定它改变了源代码 *

我该如何修复？

JavaScript

来源：https://stackoverflow.com/questions/40444526/video-js-changing-source-but-does-not-show-new-source

5条答案

按热度按时间

azpvetkf1#

刚刚发现这篇文章，VideoJS中的当前模式是使用JSON对象设置.src

player.src({ type: 'video/mp4', src: new_url });

赞(0）回复(0）举报 2023-03-28

pftdvrlh2#

你可以试试下面，

function playVideo(videoSource, type) {
  var videoElm = document.getElementById('testVideo');
  var videoSourceElm = document.getElementById('testVideoSource'); 
   if (!videoElm.paused) {
        videoElm.pause();
     }
    
   videoSourceElm.src = videoSource;
   videoSourceElm.type = type;
  
    videoElm.load();
    videoElm.play();
  }

<video id="testVideo" width="400" controls>
  <source id="testVideoSource">
</video>
<br/>
<input type="button" value="Play Video 1" onclick="playVideo('http://www.w3schools.com/html/mov_bbb.mp4', 'video/mp4')" />
<input type="button" value="Play Video 2" onclick="playVideo('http://www.w3schools.com/html/mov_bbb.ogg', 'video/ogg')" />

赞(0）回复(0）举报 2023-03-28

9gm1akwq3#

对我唯一有效的方法就是这样

var player = videojs(document.querySelector('.video-js'));
  player.src({
                src: 'videoURL,
                type: 'video/mp4'/*video type*/
            });

  player.play();

赞(0）回复(0）举报 2023-03-28

hyrbngr74#

加载新视频后，需要再次调用video.js：

var current_vid = document.getElementById("vid-player_html5_api")
var next_vid = document.createElement('video');

next_vid.innerHTML = '<source src="' + link + '" type="video/mp4">';
next_vid.muted = false;

current_vid.parentNode.replaceChild( next_vid, current_vid );

videojs(current_vid, {}, function(){
  // do something when video.js is ready
});

js：动态加载的视频

赞(0）回复(0）举报 2023-03-28

yhqotfr85#

对于React在useEffect中不返回this

return() => {
        if(player){
            player.dispose()
        }
    }

赞(0）回复(0）举报 2023-03-28

我来回答

javascript Video.js更改源代码，但不显示新的源代码

我该如何修复？

5条答案

相关问题

热门标签

最新问答