Uncaught TypeError: Cannot read property 'top' of undefined как исправить?

151
06 декабря 2018, 06:10

Скрипт меняет класс навигации при скролле по секциям на странице.

    var menu_selector = ".sticky-tabs"; 
    function onScroll() { 
        var scroll_top = $(document).scrollTop(); 
        $(menu_selector + " a").each(function () { 
            var hash = $(this).attr("href"); 
            var target = $(hash); 
            if (target.position().top <= scroll_top && target.position().top + target.outerHeight() > scroll_top) { 
                $(menu_selector + " a.active").removeClass("active"); 
                $(this).addClass("active"); 
            } else { 
                $(this).removeClass("active"); 
            } 
        }); 
    } 
    $(document).ready(function () { 
        $(document).on("scroll", onScroll); 
        $("a[href^=#]").click(function (e) { 
            e.preventDefault(); 
            $(document).off("scroll"); 
            $(menu_selector + " a.active").removeClass("active"); 
            $(this).addClass("active"); 
            var hash = $(this).attr("href"); 
            var target = $(hash); 
            $("html, body").animate({ 
                scrollTop: target.offset().top 
            }, 500, function () { 
                window.location.hash = hash; 
                $(document).on("scroll", onScroll); 
            }); 
        }); 
    });

Есть такой вот скрипт и работает полностью корректно, но консоль при скролле пишет:

Uncaught TypeError: Cannot read property 'top' of undefined
at HTMLAnchorElement.<anonymous> (sticky.php:1287)
at Function.each (jquery.js:2)
at m.fn.init.each (jquery.js:2)
at HTMLDocument.onScroll (sticky.php:1284)
at HTMLDocument.dispatch (jquery.js:4)
at HTMLDocument.r.handle (jquery.js:4)

Строка 1287:

if (target.position().top <= scroll_top && target.position().top + target.outerHeight() > scroll_top) {

Строка 1284:

$(menu_selector + " a").each(function(){

Не могу понять в чём проблема, подскажите куда копать

Answer 1

В данном случае target.position() - возвращает undefined, а это возможно только в случае когда target не нашел элементов, удовлетворяющих селектору.

Кроме того в зависимости от версии jQuery при применении этого метода, так же может быть возвращено null, следовательно ошибка может меняться на

Uncaught TypeError: Cannot read property 'top' of null(…)
READ ALSO
как из строки сделать массив и поместить данные с этого массива в select

как из строки сделать массив и поместить данные с этого массива в select

задача состоит в том чтобы при клике на кнопкуbtn получить

144
Получить название региона по точке на Яндекс картах

Получить название региона по точке на Яндекс картах

Есть скрипт яндекс карт, на карте выбирается точка и адресс точки записывается в input:

151
Применение эффекта после того как мышка покинула элемент

Применение эффекта после того как мышка покинула элемент

Нужно реализовать событие, которое по клику должно затемнять блок, но затемнение должно происходить только после того как пользователь кликнул...

139
Как узнать имя селектора после события в jQuery?

Как узнать имя селектора после события в jQuery?

Есть некий набор элементов, по которым обрабатывается нажатиеКак вернуть именно тот селектор, по которому jQuery отловил нажатие?

129