Разделите два сценария для «прокрутки до div»

Question

Я попытался сделать это сам, но, думаю, я недостаточно квалифицирован, я бросил попытку и пришел попросить о помощи. Я получил этот скрипт для своего меню на одном веб-сайте.

$(document).ready(function() { 
     $(document).on("scroll", onScroll); 

     //MENU 
     $('.menu ul li a[href^="#"]').on('click', function (e) { 
      e.preventDefault(); 
      $(document).off("scroll"); 

      $('a').each(function() { 
       $(this).attr('id', ''); 
      }) 
      $(this).attr('id', 'active'); 

      var target = this.hash; 
      $target = $(target); 
      $('html, body').stop().animate({ 
       'scrollTop': $target.offset().top+2 
      }, 1000, 'swing', function() { 
       window.location.hash = target; 
       $(document).on("scroll", onScroll); 
      }); 
     });    
    }); 

    function onScroll(event){ 
     var scrollPosition = $(document).scrollTop(); 
     $('a').each(function() { 
      var currentLink = $(this); 
      var refElement = $(currentLink.attr("href")); 
      if (refElement.position().top <= scrollPosition && refElement.position().top + refElement.height() > scrollPosition) { 
       $('.menu ul li a').attr("id", ""); 
       currentLink.attr("id", "active"); 
      } 
      else{ 
       currentLink.attr("id", ""); 
      } 
     }); 
    } 

И он отлично работает, как и я, НО Я также имею ссылки на своем веб-сайте, что я хочу, чтобы они сделали то же самое.

Я сделал это сам, но 2 скрипта были смешаны друг с другом, он применял class active к ссылке. Когда я попытался изменить ситуацию, он работал, но он не применял class active в меню ...

Я был очень смущен, и я тоже не так много программист js/jquery.

Может ли у кого-нибудь предложение о том, как отделить скрипты? Например, здесь: <a href="#contactos" class="solicitar_visita"><span>SOLICITE A NOSSA VISITA</span></a>. Это отправляет пользователя в div contactos, но он не оживляет, и я хочу, чтобы он это сделал.

Любые идеи?

EDIT: для этого второго сценария я не хочу применять любые active class. Просто перейдите к нужному div.

EDIT 2: Я считаю, что я не был ясен. Я хочу что-то вроде этого

$(document).ready(function() { 
      $(document).on("scroll", onScroll); 

      //MENU 
      $('.menu ul li a[href^="#"]').on('click', function (e) { 
       e.preventDefault(); 
       $(document).off("scroll"); 

       $('a').each(function() { 
        $(this).attr('id', ''); 
       }) 
       $(this).attr('id', 'active'); 

       var target = this.hash; 
       $target = $(target); 
       $('html, body').stop().animate({ 
        'scrollTop': $target.offset().top+2 
       }, 1000, 'swing', function() { 
        window.location.hash = target; 
        $(document).on("scroll", onScroll); 
       }); 
      }); 

      //OTHER LINKS 
      $('a[href^="#"]').on('click', function (e) { 
       e.preventDefault(); 
       $(document).off("scroll"); 

       var target = this.hash; 
       $target = $(target); 
       $('html, body').stop().animate({ 
        'scrollTop': $target.offset().top+2 
       }, 1000, 'swing', function() { 
        window.location.hash = target; 
        $(document).on("scroll", onScroll); 
       }); 
      });    
     }); 

    function onScroll(event){ 
     var scrollPosition = $(document).scrollTop(); 
     $('a').each(function() { 
      var currentLink = $(this); 
      var refElement = $(currentLink.attr("href")); 
      if (refElement.position().top <= scrollPosition && refElement.position().top + refElement.height() > scrollPosition) { 
       $('.menu ul li a').attr("id", ""); 
       currentLink.attr("id", "active"); 
      } 
      else{ 
       currentLink.attr("id", ""); 
      } 
     }); 
    } 

НО, НО сценарий «ДРУГИЕ ССЫЛКИ» будет мешать сценарию меню. Я не знаю, правильно ли я что-то делаю, я знаю, что так, как я, он не работает.

Answer 1

Вы можете использовать addClass и удалитьClass вместо attr.

$(document).ready(function() { 
     $(document).on("scroll", onScroll); 

     //MENU 
     $('.menu ul li a[href^="#"]').on('click', function (e) { 
      e.preventDefault(); 
      $(document).off("scroll"); 

      $('a').each(function() { 
       $(this).removeClass('active'); 
      }) 
      $(this).addClass('active'); 

      var target = this.hash; 
      $target = $(target); 
      $('html, body').stop().animate({ 
       'scrollTop': $target.offset().top+2 
      }, 1000, 'swing', function() { 
       window.location.hash = target; 
       $(document).on("scroll", onScroll); 
      }); 
     });    
    }); 

    function onScroll(event){ 
     var scrollPosition = $(document).scrollTop(); 
     $('a').each(function() { 
      var currentLink = $(this); 
      var refElement = $(currentLink.attr("href")); 
      if (refElement.position().top <= scrollPosition && refElement.position().top + refElement.height() > scrollPosition) { 
       $('.menu ul li a').removeClass("active"); 
       currentLink.addClass("active"); 
      } 
      else{ 
       currentLink.removeClass("active"); 
      } 
     }); 
    }