jQuery

Question

के साथ HTML5 वीडियो ऑब्जेक्ट का चयन करना मुझे jQuery के साथ HTML5 वीडियो टैग पर समस्याएं आ रही हैं।

एचटीएमएल कोड:

<video id="vid" height="400" width="550"> 
<source src="movie.mp4" type="video/mp4"> 
<source src="movie.ogv" type="video/ogg"> 
</video> 

Javascript कोड:

function playVid(){ 
    console.log($('#vid')); 
    console.log($('#vid')[0]); 
    $('#vid')[0].currentTime=5; 
    $('#vid')[0].play() 
} 

$(document).ready(){ 
    playVid(); 
} 

निम्न त्रुटि के साथ .currentTime लाइन पर कोड टूट जाता है:

InvalidStateError: An attempt was made to use an object that is not, or is no longer, usable 

यहाँ है यहाँ मेरी कोड है थोड़ा सा जिसे मैं समझ नहीं सकता - पहला console.log ऑब्जेक्ट दिखाता है मैं उम्मीद करता हूं कि इस ऑब्जेक्ट के अंदर 0 नामक एक और ऑब्जेक्ट है और इसमें .currentTime समेत सभी HTML5 वीडियो गुण और विधियां हैं जिनकी आप अपेक्षा करेंगे।

हालांकि जैसे ही मैं $('#vid')[0] का दूसरा लॉग करता हूं, यह वीडियो टैग के लिए HTML कोड दिखाता है, न कि ऑब्जेक्ट जिसे मैं 0 कहलाता था। मुझे console.log($('#vid')["0"]) और console.log($('#vid').get(0)) के लिए सटीक एक ही परिणाम मिलते हैं।

क्या नामक ऑब्जेक्ट पर $('#vid') द्वारा ऑब्जेक्ट में प्राप्त करने का कोई तरीका है जो jQuery में काम करता है?

Answer 1

मुझे लगता है कि आप तैयार होने से पहले वीडियो तत्व से बातचीत करने की कोशिश कर रहे हैं। इस तरह

कोशिश कुछ:

function loadStart(event) 
{ 
    video.currentTime = 1.0; 
} 

function init() 
{ 
    video.addEventListener('loadedmetadata', loadStart, false); 
} 
document.addEventListener("DOMContentLoaded", init, false); 

स्रोत: HTML5 Video - Chrome - Error settings currentTime

Answer 2

function playVid(){ 
    $('#vid').get(0).currentTime=5; 
    $('#vid').get(0).play() 
} 

$(window).load(function(){ 
    playVid(); 
}); 

Here एक jsfiddle उदाहरण है।

Answer 3

मुझे एक ही समस्या है (ऑडियो के साथ)। मुझे विश्वास नहीं है कि स्वीकृत उत्तर समस्या को हल करता है या बताता है, काफी हद तक क्योंकि यह एक jquery समाधान नहीं है।

अजीब बात मैं प्राप्त कर सकते हैं मौजूदा समय संपत्ति है, और मैं भी यकीन है कि ध्वनि पहले से ही मौजूदा समय और एक ही त्रुटि तब होती है स्थापित करने के लिए प्रयास करने से पहले निभाई है कर सकते हैं, तो मुझे नहीं लगता कि इस के लिए कुछ भी नहीं है मीडिया के साथ 'तैयार' होने के साथ करो।

var a = $("#myaudio").get(0); // a html5 audio element 
console.log(a)    // dumps the object reference in the console 
console.log(a.currentTime); // works fine, logs correct value 
a.currentTime = 100   // fails with an InvalidStateError 

का संभावित हल एक setTimeout

setTimeout(function(){ 
      a.currentTime = 0; 
     },1); 

उपयोग करने के लिए है ... लेकिन मैं समझने के लिए क्यों यह विफल हो रहा है चाहते हैं!

Answer 4

var a_video = $('#video_id'); 

a_video.on('loadeddata', function() { 
    if(a_video.readyState != 0) { 
    a_video[0].currentTime = 100; 
    } else { 
    a_video.on('loadedmetadata', function() { 
     a_video[0].currentTime = 100; 
    }); 
    } 
}); 

Answer 5

तुम भी एक try - catch का उपयोग इस समस्या से बचने के लिए कर सकते हैं:

$(document).ready(function() { 

    var $video = $('#vid'), 
     video = $video[0]; 

    function playVid() { 
     video.currentTime = 5; 
     video.play(); 
    } 

    try { 
     playVid(); 
    } catch(error) { 
     $video.on('loadedmetadata', playVid); 
     video.load(); 
    } 

}); 

Answer 6

मैं एक समान समस्या थी लेकिन क्योंकि मैं timecodes के साथ काम घटना श्रोता उपयोग नहीं कर सकते और कार्यों क्लिक वर्तमान स्थापित करने के लिए पहर। लेकिन मुझे एक कामकाजी समाधान भी मिला।जब भी मैं एक बटन (हर एक बटन एक अलग समय चर है) पर क्लिक करें यह क्लिक समारोह के भीतर कोड है:

$("#movie").get(0).play(); 
setTimeout(function() { 
    $("#movie").get(0).currentTime = my_time_variable; 
}, 500); 

तो समारोह InvalidStateError अब घटित नहीं होगा फायरिंग से पहले 0.5 सेकंड इंतजार कर रहे हैं। शायद यह एक त्वरित और गंदे समाधान है लेकिन यह काम करता है;)

Answer 7

मुझे ऑडियो के साथ एक ही समस्या थी। यह एक आपदा है :)। वर्तमान समय सेट करने से पहले आपको ऑडियो खेलना होगा। मुझे इसके चारों ओर कोई और रास्ता नहीं मिला। संदर्भ के लिए यहां एक अच्छा धागा है: https://github.com/johndyer/mediaelement/issues/243

तत्व चलाएं, फिर 'प्लेइंग' ईवेंट के लिए एक ईवेंट श्रोता सेट करें जो वर्तमान समय निर्धारित करेगा। मुझे एक अनंत लूप को रोकना पड़ा, इसलिए मैंने विधि के बाहर 'लोडप्लेड' सेट किया। यह सुरुचिपूर्ण नहीं हो सकता है, लेकिन यह काम करता है इसलिए मैं इसे रख रहा हूं।

audioplayer.src = source; 
audioplayer.play(); 
audioplayer.addEventListener('playing', function() { 
    if (loadPlayed == false) 
    { 
     audioplayer.currentTime = Time; 
     audioplayer.play(); 
     loadPlayed = true; 
    } 
    else { 
     audioplayer.removeEventListener('playing', this); 
    } 
});