Question

我有一个包含一些标签的页面。我创建了带有哈希的链接，以自动加载该选项卡的内容。在这方面一切正常，但每次我使用哈希URL时，它都会加载正确的内容，但会将页面加载到它加载的内容的顶部，而不是页面的顶部。我想禁用它，但保持正确的内容加载。 ScrollTop似乎没有做任何事情。

$(function(){
    var Div1 = $('#Div1');
    var Div2 = $('#Div2');
    var Div3 = $('#Div3');

    if (location.hash === "#Show_Div1") {
        $(Div1).removeClass('is-visuallyhidden').siblings().addClass('is-visuallyhidden');
        $(this).scrollTop(0);
    } else if (location.hash === "#Show_Div2"){
        $(Div2).removeClass('is-visuallyhidden').siblings().addClass('is-visuallyhidden');
        $(this).scrollTop(0);
    } else if (location.hash === "#Show_Div3"){
        $(Div3).removeClass('is-visuallyhidden').siblings().addClass('is-visuallyhidden');
        $(this).scrollTop(0);
    }
});

Answer 1

   $(function() {
    var Div1 = $('#Div1');
    var Div2 = $('#Div2');
    var Div3 = $('#Div3');

    if (location.hash === "#Show_Div1") {
        setTimeout(function() {
            window.scrollTo(0, 0);
            $(Div1).removeClass('is-visuallyhidden').siblings().addClass('is-visuallyhidden');
        }, 1);

    } else if (location.hash === "#Show_Div2") {
        setTimeout(function() {
            window.scrollTo(0, 0);
            $(Div2).removeClass('is-visuallyhidden').siblings().addClass('is-visuallyhidden');
        }, 1);

    } else if (location.hash === "#Show_Div3") {
        setTimeout(function() {
            window.scrollTo(0, 0);
            $(Div3).removeClass('is-visuallyhidden').siblings().addClass('is-visuallyhidden');
        }, 1);

    }
});

根据我的理解希望这可以帮助！！！

了解更多详情vistit how to disable anchor jump when loading a page

在url中使用hash来显示内容，但不要在页面加载时滚动到锚点

1 个答案: