如何禁用锚点“跳转"加载页面时? [英] How to disable anchor "jump" when loading a page?

查看:142
本文介绍了如何禁用锚点“跳转"加载页面时?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我认为这可能无法实现,将尽我所能尽力解释. 我有一个页面,其中包含选项卡(由jquery驱动),由以下控件控制:

I think this may not be possible, will try and explain as best as I can. I have a page containing tabs (jquery powered), controlled by the following:

我正在使用此代码,是由上一个问题中的另一个用户提供的.

I'm using this code, as provided by another user from a previous question.

<script type="text/javascript">
    $(function() {

     $('html, body').animate({scrollTop:0}); // this is my "fix"

        var tabContent = $(".tab_content");
        var tabs = $("#menu li");
        var hash = window.location.hash;
     tabContent.not(hash).hide();
        if(hash=="") {
      $('#tab1').fadeIn();
     }
        tabs.find('[href=' + hash + ']').parent().addClass('active');

        tabs.click(function() {
            $(this).addClass('active').siblings().removeClass('active');
            tabContent.hide();
            var activeTab = $(this).find("a").attr("href");

            $(activeTab).fadeIn();
           return false;
        });

    });
</script>

当我直接访问标签"页面时,此代码非常有用.

this code works great when I visit the "tabs" page directly.

但是,我需要链接到其他页面上的单个选项卡-为此,代码获取window.location.hash然后显示适当的选项卡.

however, I need to link to invidual tabs from other pages - so to do this, the code gets the window.location.hash then shows the appropiate tab.

由于"return false",页面不会跳转"到锚点.

the page doesn't "jump" to the anchor because of "return false".

该事件仅在单击事件上触发.因此,如果我从任何其他页面访问我的标签",都会触发跳转"效果.为了解决这个问题,我自动滚动到页面顶部,但我希望这没有发生.

this event is only triggered on a click event however. hence, if i visit my "tabs" from any other page, the "jump" effect is triggered. To combat this I automatically scroll to teh top of the page, but I would rather this didn't happen.

有什么方法可以在页面加载时模拟返回假",从而防止出现锚点跳转".

is there any way to simulate "return false" when the page loads, preventing the anchor "jump" from occuring.

希望这很清楚.

谢谢

推荐答案

您的修复程序不起作用吗?我不确定我是否正确理解了这个问题-您是否有演示页面?您可以尝试:

Does your fix not work? I'm not sure if I understand the question correctly - do you have a demo page? You could try:

if (location.hash) {
  setTimeout(function() {

    window.scrollTo(0, 0);
  }, 1);
}

经过测试,并且可以在Firefox,IE和amp;中运行. Windows上的Chrome.
setTimeout()移到if块内,支撑@vsync.

tested and works in Firefox, IE & Chrome on Windows.
Edit 2: move setTimeout() inside if block, props @vsync.

这篇关于如何禁用锚点“跳转"加载页面时?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆