如何使用jQuery更改視頻src？

如何使用jQuery更改HTML5視頻標籤的src？如何使用jQuery更改視頻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);

它改變了，如果我檢查它使用Firebug的SRC，但實際上並沒有改變視頻正在播放。

我讀了關於.pause（）和.load（），但我不知道如何使用它們。

來源

2010-10-20 Aximili

嘗試$("#divVideo video")[0].load();更改src屬性後。

來源

2010-10-20 23:20:37

謝謝。它工作正常。 :) – 2014-09-15 03:53:03

-1

最簡單的方法是使用自動播放功能。

<video autoplay></video>

當您通過javascript更改src時，您不需要提及load（）。

來源

2012-04-05 15:01:44 Hasanavi

我寧願讓它這樣

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

</video>

然後用

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

來源

2012-12-23 02:05:20 smaj08r

什麼工作對我來說是發出改變源後「播放」命令。奇怪的是，你不能用 '打（）' 通過jQuery的實例，這樣你只需要使用的getElementById如下：

HTML

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

JAVASCRIPT

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

來源

2013-01-08 15:06:27 Kokodoko

我一直在使用自動播放卡試圖，並且.load（）.play（）仍然需要至少在chrome中調用（也許是我的設置）。

最簡單的跨瀏覽器的方式使用您的例子是

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

不過我建議你的方式做到這一點（的易讀性和簡單性）是

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

使用jQuery做這個進一步閱讀 http://msdn.microsoft.com/en-us/library/ie/hh924823(v=vs.85).aspx#ManagingPlaybackInJavascript

附加信息：.load（）只工作，如果有視頻eleme內的HTML源元素nt（即<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>

var video = document.getelementbyid('videoID'); 
video.src = videoFile; 
video.load(); 
video.play();

來源

2014-01-08 03:18:11 vipero07

我收到一個JavaScript錯誤，說負載不支持。 IE 11. – Wade 2014-04-22 16:51:59

我添加了一些關於您的錯誤韋德的額外信息。 – vipero07 2014-04-22 17:33:07

 $(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.

來源

2014-01-09 09:26:23 sheelpriy

-1

這是6.0.2的Flowplayer工作上。

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

其中變量是一個JavaScript/jQuery的變量值，的視頻標籤應該是這樣的

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

希望它可以幫助任何人的東西。

來源

2015-07-22 16:26:19 PJunior

如何使用jQuery更改視頻src？

回答

相關問題