Задать вопрос
@olegli
javascript

Ошибка Uncaught TypeError: Cannot read property 'addEventListener' of null, в чем может быть трабла?

Есть движок в который закидываем код.
Сверстана страница - эту верстку закинули в движок.
В верстке присутствует JS скрипт который делает Drug n Drop
Скрипт
$(function () {
        $(".a305_dragNdrop").draggable({
            revert: "invalid",
            revertDuration: 1,
            stop: function (event, ui) {
                $(".a305_dragNdrop").removeClass('active');
                $(this).addClass('active');
            }
        });
        $(".a305_videoBlock").droppable({
            drop: function (event, ui) {
                $(".a305_dragNdrop").draggable("option", "revert", true).css('opacity', 1);
                $(this).addClass('dropped');
                $(this).find('source').attr('src', 'apps/305/video/' + ui.draggable.attr('rel'));
                $('video')[0].load();
                ui.draggable.css('opacity', 0);
                document.getElementById('video').addEventListener('ended', myHandler, false);
                function myHandler(e) {
                    console.log('++');
                    $('video').find('source').attr('src', 'apps/305/video/a305_base.mp4');
                    $('video').load();
                }
            }
        });
        document.getElementById('video').addEventListener('ended', myHandler, false);
        function myHandler(e) {
            console.log('++');
            $('video').find('source').attr('src', 'apps/305/video/a305_base.mp4');
            $('video').load();
        }
    });


На локалке все работает нормально и без ошибок. После переноса в движок выдается ошибка:
Ошибка
VM1189:25 Uncaught TypeError: Cannot read property 'addEventListener' of null
    at HTMLDocument.<anonymous> (<anonymous>:25:34)
    at j (jquery-1.11.3.min.js:2)
    at Object.add [as done] (jquery-1.11.3.min.js:2)
    at m.fn.init.m.fn.ready (jquery-1.11.3.min.js:2)
    at m.fn.init (jquery-1.11.3.min.js:2)
    at m (jquery-1.11.3.min.js:2)
    at <anonymous>:1:1
    at new controller (template-programmable.js:79)
    at Object.e [as invoke] (angular_1.4.9.min.js:39)
    at N.instance (angular_1.4.9.min.js:80)
(anonymous)	@	VM1189:25
j	@	jquery-1.11.3.min.js:2
add	@	jquery-1.11.3.min.js:2
m.fn.ready	@	jquery-1.11.3.min.js:2
m.fn.init	@	jquery-1.11.3.min.js:2
m	@	jquery-1.11.3.min.js:2
(anonymous)	@	VM1189:1
controller	@	template-programmable.js:79
e	@	angular_1.4.9.min.js:39
N.instance	@	angular_1.4.9.min.js:80
I	@	angular_1.4.9.min.js:61
g	@	angular_1.4.9.min.js:55
(anonymous)	@	angular_1.4.9.min.js:54
$scope.reRunPage	@	pageController.js:84
(anonymous)	@	pageController.js:28
$broadcast	@	angular_1.4.9.min.js:136
(anonymous)	@	navigationFactory.js:24
setPageIndex	@	applicationFactory.js:93
(anonymous)	@	navigationFactory.js:23
getByOrder	@	pagesFactory.js:37
navigateToPageByOrder	@	navigationFactory.js:17
navigateToPageByIncrement	@	navigationFactory.js:109
HybridgeClient.sendToApp.navigate.$scope.navigation	@	applicationUtilsFactory.js:132
scope.arrowNavigate	@	arrowsNavigation.js:51
fn	@	VM1106:4
e	@	angular_1.4.9.min.js:257
$eval	@	angular_1.4.9.min.js:133
$apply	@	angular_1.4.9.min.js:134
(anonymous)	@	angular_1.4.9.min.js:257
dispatch	@	jquery-1.11.3.min.js:4
r.handle	@	jquery-1.11.3.min.js:4


Прошу указать куда копать с этой проблемой.
  • Вопрос задан
  • 7711 просмотров
Комментировать
Подписаться 1 Оценить Комментировать
Решения вопроса 1
IonDen
@IonDen
JavaScript developer. IonDen.com
У вас проблема в ненадежности вот этой конструкции:
document.getElementById('video').addEventListener('ended', myHandler, false);


Если элемент с id="video" не будет найдет на странице, то будет ошибка как у вас. Правильней будет разбить такую конструкцию на 2 части и кидать ошибку самостоятельно.

var video_el = document.getElementById('video');
if (!video_el) {
    throw new Error("no video object found!");
}
video_el.addEventListener('ended', myHandler, false);
Ответ написан
2 комментария
2 комментария
Пригласить эксперта
Ответы на вопрос 1
@korney1978
была такая же проблема, решил

var video_el = document.getElementById('video');

if (video_el !== null) {
   video_el.addEventListener('ended', myHandler, false);
}
Ответ написан
Комментировать
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы
Вакансии с Хабр Карьеры
JavaScript FullStack разработчик
Rocket • Смоленск
от 80 000 до 130 000 ₽
Frontend-разработчик JavaScript
div. • Ставрополь
от 40 000 до 90 000 ₽
Fullstack разработчик JavaScript, php
Дорстрой-36 • Воронеж
от 100 000 до 200 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Выполнить тестовое задание с Bootstrap, HTML5, CSS3 и JavaScript
30 нояб. 2024, в 01:14
1000 руб./за проект
Деплой, разработка и поддержка Fullstack NextJS + React
29 нояб. 2024, в 23:26
2500 руб./в час
Провести CFD тестирование для оптимальной 3D
29 нояб. 2024, в 22:32
80000 руб./за проект
Ещё заказы