你如何使用jQuery更改videosrc?

你如何改变使用jQuery的HTML5video标签的src?

我有这个HTML:

<div id="divVideo"> <video controls> <source src="test1.mp4" type="video/mp4" /> </video> </div> 

这不起作用:

 var videoFile = 'test2.mp4'; $('#divVideo video source').attr('src', videoFile); 

它会改变src,如果我使用萤火虫检查它,但实际上并没有改变正在播放的video。

我读了关于.pause()和.load(),但我不知道如何使用它们。

尝试$("#divVideo video")[0].load(); 在更改src属性之后。

我宁愿这样做

 <video id="v1" width="320" height="240" controls="controls"> </video> 

然后使用

 $("#v1").html('<source src="test1.mp4" type="video/mp4"></source>' ); 

我试过使用自动播放标签,并且.load().play()仍然需要至less在铬(也许是我的设置)被调用。

最简单的跨浏览器的方式来做到这一点与jQuery使用您的例子将是

 var $video = $('#divVideo video'), videoSrc = $('source', $video).attr('src', videoFile); $video[0].load(); $video[0].play(); 

然而,我build议你这样做(易读性和简单性)的方式是

 var video = $('#divVideo video')[0]; video.src = videoFile; video.load(); video.play(); 

进一步阅读http://msdn.microsoft.com/en-us/library/ie/hh924823(v=vs.85).aspx#ManagingPlaybackInJavascript

附加信息:.load()只有在video元素中有一个html源元素时才起作用(即<source src="demo.mp4" type="video/mp4" />

非jQuery的方式是:

HTML

 <div id="divVideo"> <video id="videoID" controls> <source src="test1.mp4" type="video/mp4" /> </video> </div> 

JS

 var video = document.getelementbyid('videoID'); video.src = videoFile; video.load(); video.play(); 
  $(document).ready(function () { setTimeout(function () { $(".imgthumbnew").click(function () { $("#divVideo video").attr({ "src": $(this).data("item"), "autoplay": "autoplay", }) }) }, 2000); } }); here ".imgthumbnew" is the class of images which are thumbs of videos, an extra attribute is given to them which have video url. u can change according to your convenient. i would suggest you to give an ID to ur Video tag it would be easy to handle. 

什么对我来说是更改来源后发出“播放”命令。 奇怪的是,你不能通过jQuery实例使用“play()”,所以你只需要使用getElementByID,如下所示:

HTML

 <video id="videoplayer" width="480" height="360"></video> 

JAVASCRIPT

 $("#videoplayer").html('<source src="'+strSRC+'" type="'+strTYPE+'"></source>' ); document.getElementById("videoplayer").play(); 

这是在Flowplayer 6.0.2上工作。

 <script> flowplayer().load({ sources: [ { type: "video/mp4", src: variable } ] }); </script> 

其中variables是一个JavaScript / jQuery的variables值,video标签应该是这样的

 <div class="flowplayer"> <video> <source type="video/mp4" src="" class="videomp4"> </video> </div> 

希望它能帮助任何人。

最简单的方法是使用自动播放。

 <video autoplay></video> 

当你通过javascript来改变src时,你不需要提及load()。