javascript - 显示隐藏 Scollto 菜单不会触发普通链接？

Question

不确定我在这里做错了什么。但是当我测试这个菜单时绝对链接不会触发？我正在使用 jquery 脚本来触发菜单的显示/隐藏功能，并同时从几个 div 添加和删除特定的类名。

我想做的是让它成为访问外部页面的绝对 url。我正在使用我自己的带有绝对路径的内部页面进行测试。

<!-- START SHOW HIDE DROP MENU -->
<div id="mobileMenu" class="list-nav menu_hide"><!-- add class of menu_show, and simultaneously add a class of show-lockscreen to the screen class below. -->
    <ul>
        <li><a href="http://jonnyb.org/index.php" id="item-1">Home Screen</a></li>
        <li><a href="http://jonnyb.org/index.php">Web Focused</a>
            <ul>
                <li><a href="#websummary" class="scroll">Summary</a></li>
                <li><a href="#portfolio" class="scroll">Portfolio</a></li>
                <li><a href="#weboverview" class="scroll">Overview</a></li>
                <li><a href="#webskills" class="scroll">Skills</a></li>
            </ul>
        </li>
        <li><a href="http://jonnyb.org/music.php">Music Focused</a>
            <ul>
                <li><a href="#musicsummary" class="scroll">Summary</a></li>
                <li><a href="#music" class="scroll">Music</a></li>
                <li><a href="#video" class="scroll">Video</a></li>
                <li><a href="" class="scroll">Photos (coming soon)</a></li>
                <li><a href="#musicoverview" class="scroll">Overview</a></li>
                <li><a href="#musicskills" class="scroll">Skills</a></li>
            </ul>
        </li>
        <li><a href="#connect" class="scroll">Connect</a></li>
    </ul>
</div>
<!-- END SHOW HIDE DROP MENU -->

这是我为显示/隐藏和滚动以及其他一些使用的功能实现的简单 JS。

/* ============================================================
SCROLL TO
=============================================================== */

$(document).ready(function(){ 
    // show and hide mobile menu
    $('a#triggerMobileMenu, div#mobileMenu li a').on('click', function(evt){
        evt.preventDefault();
        $('#mobileMenu').toggleClass('menu_hide menu_show');
        $('#mobileScreen').toggleClass('lockscreen_off lockscreen_on');
    });
}); 


/*global $:false */
$(document).ready(function(){"use strict";

    $(".scroll").click(function(event){

        var full_url = this.href;
        var parts = full_url.split("#");
        var trgt = parts[1];
        var target_offset = $("#"+trgt).offset();
        var target_top = target_offset.top - 75;

        $('html, body').animate({scrollTop:target_top}, 1500);

    });
}); 


$(document).ready(function(){ 

     $(window).scroll(function(){
         if ($(this).scrollTop() > 100) {
             $('.scrollup').fadeIn();
         } else {
             $('.scrollup').fadeOut();
         }
     }); 

     $('.scrollup').click(function(){
         $("html, body").animate({ scrollTop: 0 }, 600);
         return false;
     });

 });


$(document).ready(function() {

    // the portfolio items
    var $container = $('#isotope-container');
    $container.isotope({
        layoutMode: 'masonry',
        masonry: {
            columnWidth: 127,
            gutter: 16
        },

        filter: '*',
        animationOptions: {
            duration: 750,
            easing: 'linear',
            queue: false
        }
    });


    // filter portfolio items
    $('#isotope-options a').click(function(){
        $('#isotope-options .current').removeClass('current');
        $(this).addClass('current');

        var selector = $(this).attr('data-filter');
        $container.isotope({
            filter: selector,
            animationOptions: {
                duration: 750,
                easing: 'linear',
                queue: false
            }
         });
         return false;
    });

});


$(document).ready(function() {
    $(".fancybox").fancybox();
});


$(document).ready(function() {
    $("img.lazy").lazyload({
        effect : "fadeIn"
    });
});


$(document).ready(function () {
    //call this first so we start out with the correct visibility depending on the selected form values
    toggleFields();

    //this will call our toggleFields function every time the selection value field changes
    $("#projecttype").change(function () {
        toggleFields();
    });
});

Answer 1

您正在对传入的事件调用 preventDefault()。这将阻止 anchor 标记的默认功能。