导航栏中的外部URL在引导程序中不起作用 [英] External URL in nav bar doesn't work in bootstrap

问题描述

最近设置了一个主题运行引导程序，以作为我们的网站运行.一切正常，包括放置在HTML中的外部URL.

Recently set up a theme running bootstrap to run as our website. Everything works fine, including external URLs that have been placed in the HTML.

问题是，实际的导航栏不会注册外部URL，并且在您单击时不会打开它们.它已被JS"Magnific Popup"阻止，但我不知道具体为什么.任何帮助将不胜感激.

The thing is, the actual navigation bar does not register the external URLs and will not open them when you click. It's being stopped by the JS "Magnific Popup" but I do not know why specifically. Any help would be greatly appreciated.

这里是网站的链接，错误的导航栏在右上角.

Here is a link to the website, and the navigation bar with the error is top-right.

俄罗斯网站

推荐答案

这通常是由javascript内部的preventDefault()方法引起的.我相信导航原本打算用于锚定滚动.在main.js文件中，您将在第62行找到以下代码.

This is usually caused by preventDefault() method inside the javascript. I believe the navigation originally intended for anchor scrolls. Inside the main.js file, you will find the following code in line 62.

// Page Nav
var clickMenu = function() {

    $('#navbar a:not([class="external"])').click(function(event){
        var section = $(this).data('nav-section'),
            navbar = $('#navbar');

            if ( $('[data-section="' + section + '"]').length ) {
                $('html, body').animate({
                    scrollTop: $('[data-section="' + section + '"]').offset().top
                }, 500);
           }

        if ( navbar.is(':visible')) {
            navbar.removeClass('in');
            navbar.attr('aria-expanded', 'false');
            $('.js-fh5co-nav-toggle').removeClass('active');
        }

        event.preventDefault();
        return false;
    });


};

如您所见，该函数阻止了默认操作.阅读此函数后，您可以看到jquery选择器正在寻找没有外部"类的a标记.只需在标签中添加外部"类即可解决此问题.

As you can see the function is preventing the default action. After reading this function, you can see the jquery selector is looking for the a tags without "external" class. Simply adding "external" class to the a tag will fix the issue.

这篇关于导航栏中的外部URL在引导程序中不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！