Почему не получаю атрибут Href?

Question

[DeniSidorenko]

$('a[href^="#"]').click(function () { 
  elementClick = $(this).attr("href");
  destination = $(elementClick).offset().top;
  if($.browser.safari){
    $('body').animate( { scrollTop: destination }, 1100 );
  }else{
    $('html').animate( { scrollTop: destination }, 1100 );
  }
  return false;
});

Добрый день , подскажите пожалуйста, есть такой скрипт . Но не работает. Ошибка
app.js:305 Uncaught ReferenceError: elementClick is not defined
Как я понял в this мы получаем именно сылку, проверил, однако .attr никак не работает, много пробовал но ничего

Answer 1

[Дмитрий Лузанов]

var пропустили. Наверное работаете в строгом режиме.

var elementClick = $(this).attr("href");
var destination = $(elementClick).offset().top;

Comments

[DeniSidorenko]

Спасибо
А данная ошибка не знайте почему появляется
Cannot read property 'top' of undefined
https://jsfiddle.net/d83tocz1/

Answer 2

[Александр Талалаев]

Ваши переменные еще не объявлены (ранее в коде), нужно объявить их с помощью ключевого слова var, они буду видны только внутри анонимной функции

$('a[href^="#"]').click(function () { 
 var elementClick = $(this).attr("href");
  var destination = $(elementClick).offset().top;
  if($.browser.safari){
    $('body').animate( { scrollTop: destination }, 1100 );
  }else{
    $('html').animate( { scrollTop: destination }, 1100 );
  }
  return false;
});

Сниппет для плавного скролла:

// Выбираем все ссылки с хэшем
    $('a[href*="#"]')
/* Убираем ненужные, либо те которые нужны для других целей, например для галерей, так что сюда можешь добавить список хешей на который плавный скролл не будет реагировать */
        .not('[href="#"]')
        .not('[href="#0"]')
        .click(function(event) {
            // Проверяем что все хеши на том домене
            if (
                location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '')
                &&
                location.hostname == this.hostname
            ) {
                // Находим цель
                var target = $(this.hash);
                target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
                // Существует ли целевой элемент?
                if (target.length) {
                    // Блокируем поведение по умлочанию, только в случае если анимация на понадобилась
                    event.preventDefault();
                    $('html, body').animate({
                        scrollTop: target.offset().top
                    }, 1000, function() {
                        // Callback after animation
                        // Меняем фокус (бывает полезно, обычно не мешает)
                        var $target = $(target);
                        $target.focus();
                        if ($target.is(":focus")) { // Получил ли целевой элемент фокус
                            return false;
                        } else {
                            $target.attr('tabindex','-1');
                            $target.focus(); 
                        };
                    });
                }
            }
        });

Comments

[DeniSidorenko]

Спасибо
А данная ошибка не знайте почему появляется
Cannot read property 'top' of undefined
https://jsfiddle.net/d83tocz1/

[Александр Талалаев]

Ну вообще лучше так:
var elementClick = this.hash;
После этого, если все хорошо и было значение href='#smnhng' , можно будет использовать $(elementClick ).
Как я понял тебе нужен плавный скролл есть более универсальный сниппет:

// Выбираем все ссылки с хэшем
    $('a[href*="#"]')
/* Убираем ненужные, либо те которые нужны для других целей, например для галерей, так что сюда можешь добавить список хешей на который плавный скролл не будет реагировать */
        .not('[href="#"]')
        .not('[href="#0"]')
        .click(function(event) {
            // Проверяем что все хеши на том домене
            if (
                location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '')
                &&
                location.hostname == this.hostname
            ) {
                // Находим цель
                var target = $(this.hash);
                target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
                // Существует ли целевой элемент?
                if (target.length) {
                    // Блокируем поведение по умлочанию, только в случае если анимация на понадобилась
                    event.preventDefault();
                    $('html, body').animate({
                        scrollTop: target.offset().top
                    }, 1000, function() {
                        // Callback after animation
                        // Меняем фокус (бывает полезно, обычно не мешает)
                        var $target = $(target);
                        $target.focus();
                        if ($target.is(":focus")) { // Получил ли целевой элемент фокус
                            return false;
                        } else {
                            $target.attr('tabindex','-1');
                            $target.focus(); 
                        };
                    });
                }
            }
        });

[DeniSidorenko]

Александр Талалаев, Спасибо большое за скрипт

[Александр Талалаев]

DeniSidorenko, не за что, вроде бы когда то нашел его на гитхабе.
Ну будущее совет, часто полезно искать в гугле так: github нужная фича - это для библиотек, каких-то больших штук обычно. github gist нужная фича - это для снипетов, коротких полезных кусков кода, короче для всякой мелочевки.

[DeniSidorenko]

Александр Талалаев, Спасибо за подсказку

[cc08]

Я искал тебя 2 дня. Спасибо !

Answer 3

[Алексей Уколов]

Проблема не в том, что вы значение атрибута не можете получить, а в том, что переменная elementClick не существует. Проверьте код на опечатки, добавьте var перед переменными.

Comments

[DeniSidorenko]

Спасибо
А данная ошибка не знайте почему появляется
Cannot read property 'top' of undefined
https://jsfiddle.net/d83tocz1/