Медиа-события HTML5 не работают должным образом

Question

Я хочу создать запасной вариант изображения в случае, если видео не может быть загружено. Я обнаружил, что решение состоит в том, чтобы использовать медиа-события для этой проблемы. Тем не менее, они не работают должным образом.

/**
 * Dynamically load the video within the given slide.
 */
var loadVideo = function(slide) {
    var video = $('<video muted>'),
        source = $('<source>', {
            src: slide.attr('data-video'),
            type: 'video/mp4'
        });

    video.html(source);

    video[0].addEventListener('canplay', revealVideo(video), false);
    video[0].addEventListener('error', function() {
        alert('Video could not be loaded.');
        // fallback
    }, false);
    video[0].onended = function() { replayVideo(video) };

    slide.append(video);
};

Неважно, успешно ли загружено видео или нет, revealVideo() всегда будет звонить. EventListener error никогда не срабатывает (например, при использовании src который не существует).

Answer 1

Я нашел решение. Похоже, что <source> элемент получает ошибки, а не сам элемент видео.