2014-02-20 2 views
4

나는 절망적이다.html5 청취 레코드가 적용되지 않음

var myVid=document.getElementById("movie"); 
myVid.onloadeddata=console.log("Browser has loaded the current frame"); 

을이 그렇지 않은 : 이 작동하는 이유 www.x.opteynde.com

내 목표 :

myVid.addEventListener("loadeddata", function() { 
    alert("loadeddata"); 
    }); 

그것을 실행하는 소리 그녀의 내 페이지

파이어 폭스 (27) 모두 시도 동영상의 로딩 시간을 얻는 것입니다.

답변

4
var myVid = document.getElementById("movie"); 
myVid.onloadeddata = console.log("Browser has loaded the current frame"); 

예상치 않습니다. 함수를 myVid.onloadeddata에 바인딩하지 않고, console.log()을 즉시 실행하고 그 반환 값을 myVid.onloadeddata으로 설정합니다.

이 작업을 수행 할 수있는 적절한 방법입니다 :

myVid.onloadeddata = function() { 
    console.log("Browser has loaded the current frame"); 
} 

그래서이 설명하는 이유 콘솔에서이 것 출력 뭔가. 온

loadeddata에 :

definition of loadeddata은 :

사용자 에이전트는 제 시간에 대한 현재의 재생 위치에서 상기 미디어 데이터를 렌더링 할 수있다.

는 약간 덜 공식적인 발언에서,이 의미 : "사용자 에이전트가 실제 영상의 적어도 하나의 프레임 렌더링 할 수있다"를. 분명히

Specified "type" attribute of "video/mp4" is not supported. Load of media resource fliege.mp4 failed. 
HTTP load failed with status 404. Load of media resource http://www.x.opteynde.com/fliege.ogv failed. 
All candidate resources failed to load. Media load paused. 

는, 파이어 폭스는로드 할 수있는 비디오에서 프레임을 렌더링 할 수 없기 때문에이 (404)가 문제 될 것으로 보인다 내 파이어 폭스 오류 콘솔에서

나는 이러한 오류를 참조하십시오.

P.
this exampleloadeddata은 '재생'버튼을 클릭하기 전까지는 실행되지 않습니다.

+0

그래, 그 이유는 내가 당신의 대답을 언급했는지. 나는 방금 연장했다. Gj btw – SpYk3HH

+0

미안하지만 그건 내 질문이 아니야. myVid.onloadeddata와 같은 함수를 추가하는 방법을 알고 있습니다 ... 잘 작동합니다 : myVid.onloadeddata = console.log ("브라우저가 현재 프레임을로드했습니다"); 문제는 addEventListener가 작동하지 않는 이유입니다. – hamburger

+1

@hamburger 글쎄, 당신이 게시 한 코드가 올바르지 않았고, (아마도 404와 함께) 당신의 혼란의 원천 일 것입니다. – Carpetsmoker

0

위대한 explination by Carpetsmoker.

그러나 제 질문은 jQuery로 태그 지정 했으므로 jQuery를 사용하지 않는 이유는 무엇입니까?

그래서 저는 그의 대답에 약간의 jQuery 팁을 추가하고 있습니다.

jQuery에서는 CSS 선택기를 사용하여 쉽게 요소를 가져올 수 있습니다. 예를 들어, ID movie하면있는 거 요소로 얻을로 쉽게 :

var myVid = $('#movie'); 

거기에서 당신은 쉽게 그것을 사용할 수있다.

$('#movie').on('event', function(e) { /* do work */ }); 

말했다 난 100 % 확신 $('#movie').on('loadeddata ' 실제로 작동 아니에요 :로

나는 당신이 일을하지만, 일반적으로 jQuery를에 이벤트를 할당하는지에 익숙하지 않아요는 간단합니다.

: 나는 많은 미디어와 함께 연주 havn't는,하지만 난 당신이 바닐라 JS의 실제 요소를 사용할 필요가 있다면 당신은 또한, 적어도 jQuery의 .load()

마지막에 보이지만하지 않을 수 있습니다 알고, 단지 뭔가를 할

var myVid = $('#movie')[0]; // much easier to read and reuse than .getElementByID 
// however take note, this is more JS to run thus causing a a lil less speed 
myVid.onloaddata = function() { /* do work */ }; 
+1

예, 분명히 jQuery가 더 좋을 것입니다. 그래도 내 대답은 길어 보지 않으려 고 했어 ;-) 그리고'.on ('loadeddata' '는 예상대로 작동 할 것이다.) – Carpetsmoker

+0

$ ('# movie '). on ('loadstart ', function ( 도 동작하지 않습니다. – hamburger

2

2 일 동안 검색 한 결과 해결책을 찾았습니다. 이벤트를 시작하려면 이전에 video.load()가 있어야합니다. html-video-markup의 루프 및 자동 재생 태그가 충분하지 않습니다.

+0

'$ ('# movie').로드 (function (e) {/ * do work * /});} {console.log ("_ onloadstart third execution" ' – SpYk3HH

0

나는 여기에 같은 문제가있어 문제는 body.onload 이벤트 내에 이벤트 리스너를 등록했다는 것입니다.

window.onload = function() { 
      myVideo.addEventListener('loadeddata', function() { 
      alert('loadeddata'); 

     }); 
} 

window.onload 이벤트가 발생하면 myVideo.loadeddata가 이미 실행되었습니다.

관련 문제