आप jQuery का उपयोग कर वीडियो स्रोत कैसे बदलते हैं?

Question

आप jQuery का उपयोग कर एक HTML5 वीडियो टैग के स्रोत को कैसे बदलते हैं?

<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 अगर मैं फ़ायरबग का उपयोग कर निरीक्षण बदलता है, लेकिन वास्तव में परिवर्तन नहीं करता है वीडियो खेला जा रहा

मैं इस HTML मिला है।

मैंने .pause() और .load() के बारे में पढ़ा है, लेकिन मुझे यकीन नहीं है कि उनका उपयोग कैसे करें।

Answer 1

src विशेषता को बदलने के बाद $("#divVideo video")[0].load(); आज़माएं।

Answer 2

ऑटोप्ले का उपयोग करने का सबसे आसान तरीका है।

<video autoplay></video> 

जब आप स्रोत बदलने जावास्क्रिप्ट के माध्यम से आप की जरूरत नहीं है लोड उल्लेख करने के लिए()।

Answer 3

मैं नहीं बल्कि यह इस

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

</video> 

की तरह होगा और उसके बाद का उपयोग

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

Answer 4

मुझे जारी कर के लिए स्रोत बदलने के बाद आदेश 'खेलने' क्या काम किया।

एचटीएमएल

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

JAVASCRIPT

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

Answer 5

मैं ऑटोप्ले टैग का उपयोग कर की कोशिश की है: अजीब आप ') (खेलने' एक jQuery उदाहरण के माध्यम से, ताकि आप केवल getElementByID इस प्रकार का उपयोग उपयोग नहीं कर सकते , और .load() .play() को कम से कम क्रोम में कॉल करने की आवश्यकता है (शायद इसकी मेरी सेटिंग्स)।

अपने उदाहरण का उपयोग

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

अतिरिक्त जानकारी: अगर वहाँ वीडियो eleme के अंदर एक html स्रोत तत्व है .load() ही काम करता है एनटी (यानी<source src="demo.mp4" type="video/mp4" />)

गैर jQuery तरीका होगा:

एचटीएमएल

<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(); 

Answer 6

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

Answer 7

यह Flowplayer 6.0.2पर काम कर रहा है।

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

जहां चर एक जावास्क्रिप्ट/jQuery चर मूल्य है, वीडियो टैग कुछ ऐसा

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

आशा है कि यह किसी को भी मदद करता है होना चाहिए।