2015-05-08 6 views
7

मुझे पता है कि मैं 'लूप' विशेषता का उपयोग करके असीमित रूप से एक वीडियो लूप कर सकता हूं। लेकिन क्या मैं वीडियो की संख्या को 5 बार तक सीमित कर सकता हूं?एचटीएमएल 5 वीडियो खेलने की संख्या सीमित करें

उत्तर

15

आपको इसे प्राप्त करने के लिए जावास्क्रिप्ट का उपयोग करने की आवश्यकता होगी। तो क्या यहाँ हो रहा

var iterations = 1; 
 

 
document.getElementById('iteration').innerText = iterations; 
 

 
myVideo.addEventListener('ended', function() {  
 

 
    if (iterations < 5) {  
 

 
     this.currentTime = 0; 
 
     this.play(); 
 
     iterations ++; 
 
     
 
     document.getElementById('iteration').innerText = iterations; 
 

 
    } 
 

 
}, false);
<div>Iteration: <span id="iteration"></span></div> 
 

 
<video width="320" height="240" id="myVideo" controls> 
 
    <source src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4" type="video/mp4" /> 
 
    <source src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.ogv" type="video/ogg" /> 
 
    Your browser does not support the video tag. 
 
</video>

...: नीचे टुकड़ा पर एक नज़र है?

  1. हम एक चर जो हमारे वर्तमान यात्रा स्टोर करेगा iterations कहा जाता है को परिभाषित करते हुए शुरू करते हैं। हमने इसे 1 के रूप में सेट किया है।
  2. हम एक ईवेंट श्रोता myVideo वीडियो में जोड़ते हैं जो वीडियो समाप्त होने पर आग लगती है।
  3. हम तब जांचते हैं कि iterations वैरिएबल ने हमारे नाटकों की संख्या को पार नहीं किया है जो 5 है।
  4. हम currentTime0 को रीसेट करने के लिए और फिर play() फ़ंक्शन का उपयोग वीडियो शुरू करने के लिए द्वारा वीडियो को पुनरारंभ करें।
  5. फिर हम 1 द्वारा iterations चर को बढ़ा देते हैं और जब तक हमारे iterations चर 5 तक पहुँच जाता है, जिस पर यह बंद हो जाता है इंगित पूरी प्रक्रिया फिर से शुरू होता है।
+0

उत्तर के लिए धन्यवाद। मेरे मामले में एक साधारण लूप = '5' बहुत अच्छा होगा। उम्मीद है कि यह अगले spec में होगा। :) –

+0

@AsimKT मैं सहमत हूं। मैं समझ नहीं पा रहा हूं कि मानक द्वारा कुछ इतना आसान क्यों लागू नहीं किया गया था। –

संबंधित मुद्दे