Navbar-spy на BootStrap 3 не разрешает внешние ссылки

Question

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

Вот код. Что нужно изменить, чтобы разрешить эти не # ссылки?

<div id="navbar-section" class="navbar navbar-static-top"> 
    <div class="container"> 

    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse"> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
    </button> 

    <div id="navbar-spy" class="nav-collapse collapse navbar-responsive-collapse"> 
     <ul class="nav navbar-nav"> 
     <li class="active"><a href="#home"><i class="icon-home"></i></a></li> 
     <li><a href="#services">Services</a></li> 
     <li><a href="#about">About</a></li> 
     <li><a href="#contact">Contact</a></li> 
     <li><a href="blog.html">Blog</a></li> 
     <li class="dropdown"> 
      <a class="dropdown-toggle" data-toggle="dropdown" href="#">Infos <span class="caret"></span></i></a> 
       <ul class="dropdown-menu"> 
       <li class="nav-header">Menu 1</li> 
       <li> 
        <a href="external1.html">external 1</a> 
       </li> 
       <li> 
        <a href="external2.html">external 2</a> 
       </li> 
       <li class="nav-header">Menu 2</li> 
       <li> 
        <a href="external3.html">external 3</a> 
       </li> 
       <li> 
        <a href="external4.html">external 4</a> 
       </li> 
       </li> 
       </ul> 
     </li> 
    </div> 
    </div> 
</div> 

Кстати, Dologan дал подсказку (может быть?) На другую должность имеет дело с небольшим другим вопросом, но я не уверен, как добавить это, чтобы он мог решить мою проблему.

Ссылка здесь: How to add smooth scrolling to Bootstrap's scroll spy function

Спасибо за ваше время ценится!

- ОБНОВЛЕНИЕ -

я нашел, где проблема приходит, этот кусок кода в custom.js файле:

$('#navbar-spy').off('click').on('click', 'a', function(e) {   

      e.preventDefault(); 

      var elmHash = $(this).attr('href'); 
      var elmOffsetTop = Math.ceil($(this.hash).offset().top); 
      var windowOffsetTop = Math.ceil($(window).scrollTop()); 

      if(elmOffsetTop != 0) { 
       elmOffsetTop = elmOffsetTop - 70; 
       if(windowOffsetTop == 0) { 
        elmOffsetTop = elmOffsetTop - 70; 
       } 
      } 

      //console.log($(this).attr('href'));    
      $('html:not(:animated), body:not(:animated)').animate({ scrollTop: elmOffsetTop }, 1100);            

     }); 

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

Любые идеи?

Answer 1

Ваш вопрос не дает четкого представления о вашей проблеме. Внешние ссылки не имеют hash поэтому elmOffsetTop = Math.ceil($(this.hash).offset().top); даст ошибку.

Добавить if(!$(this).attr('href').match(/^#/)) return; в начале вашего JavaScript, чтобы предотвратить эту ошибку:

$('#navbar-spy').off('click').on('click', 'a', function(e) {   

      if(!$(this).attr('href').match(/^#/)) return; 
      e.preventDefault(); 

      var elmHash = $(this).attr('href'); 
      var elmOffsetTop = Math.ceil($(this.hash).offset().top); 
      var windowOffsetTop = Math.ceil($(window).scrollTop()); 

      if(elmOffsetTop != 0) { 
       elmOffsetTop = elmOffsetTop - 70; 
       if(windowOffsetTop == 0) { 
        elmOffsetTop = elmOffsetTop - 70; 
       } 
      } 

      //console.log($(this).attr('href'));    
      $('html:not(:animated), body:not(:animated)').animate({ scrollTop: elmOffsetTop }, 1100);            

     }); 

Answer 2

Не удаляйте весь код, так как вы потеряете всю прокрутки анимации, достаточно просто не вызвать функцию e.preventDefault();, удалите его, и все будет в порядке.