сокращение кода jQuery

211
09 марта 2018, 14:13

Доброго дня!

Такая проблема: есть два абсолютно подобных события на jQuery (прокрутка до якоря при нажатии по ссылке). Сейчас я каждый раз при добавлении ссылки на сайт, добавляю по новой этот скрипт. Получается много кода, подобного кода. Чувствую что это как то возможно сократить. Просто добавляя новый линк в этот скрипт. Но не могу. Помогите пожалуйста.

Вот пример:

  $('a[href^="#advantages"]').bind('click.smoothscroll',function (e) { 
    e.preventDefault(); 
  
   var target = this.hash, 
     $target = $(target); 
    
    $('html, body').stop().animate({ 
     'scrollTop': $target.offset().top 
    }, 1200, 'swing', function () { 
      window.location.hash = target; 
    }); 
  }); 
 
  $('a[href^="#application"]').bind('click.smoothscroll',function (e) { 
    e.preventDefault(); 
  
   var target = this.hash, 
     $target = $(target); 
    
    $('html, body').stop().animate({ 
     'scrollTop': $target.offset().top 
    }, 1200, 'swing', function () { 
      window.location.hash = target; 
    }); 
  });

Answer 1

Для того чтобы не дублировался код можно добавить общий класс для ссылок такого типа.

 $('a.anchor').bind('click.smoothscroll',function (e) {
    e.preventDefault();
   var target = this.hash,
     $target = $(target);
    $('html, body').stop().animate({
     'scrollTop': $target.offset().top
    }, 1200, 'swing', function () {
      window.location.hash = target;
    });
  });

Либо как предложили в комментариях. Если у вас для всех ссылок такого типа будет одинаковая анимация проще использовать селектор a[href^="#"]. Или даже без указания тега a. Вот так [href^="#"].

READ ALSO
Как запустить python скрипт из html при нажатии на кнопку?

Как запустить python скрипт из html при нажатии на кнопку?

Есть простая html страница с popup'омНужно запускать python скрипт при открытии попапа (попап открывается при нажатии на кнопку)

257
Как перенести анимацию SVG из GearGenerator на сайт?

Как перенести анимацию SVG из GearGenerator на сайт?

Подскажите пожалуйста как правильно перенести и подключить вот эту http://geargeneratorcom/#200,200,100,6,1,0,0,4,1,8,2,4,27,-90,0,0,16,4,4,27,-60,1,1,12,1,12,20,-60,2,0,60,5,12,20,0,0,0,2,-563...

240
Получение данных с html <input> в TypeScript

Получение данных с html <input> в TypeScript

Не могу получить значения с html

194
Можно ли оптимизировать код? [требует правки]

Можно ли оптимизировать код? [требует правки]

Приветствую, данный код можно оптимизировать?

309