Question

我非常接近我想要完成的事情，但我有两个问题（我知道）：

1）如果用户导航到另一个站点（前进或后退按钮），然后返回，则最后的“状态”未在历史记录中正确注册，但任何先前的“状态”都已正确添加。 / p>

2）除非使用向前或向后导航，否则Div图层不会显示在FireFox中。单击以显示Div图层，您可以查看是否一瞬间消失。

HTML / JavaScript代码：

<html> 
 <head> 
 <title>Test Nav</title> 

    <script language="JavaScript">
        function clicked(divID) {
            document.getElementById('divOne').style.display = 'none';
            document.getElementById('divTwo').style.display = 'none';
            document.getElementById(divID).style.display = 'block';
            data = divID || null;
            history.pushState(data,'Test','\Test04.html');

            return event.preventDefault();
        }
        function updateContent(data) {
            document.getElementById('divOne').style.display = 'none';
            document.getElementById('divTwo').style.display = 'none';
            document.getElementById(data).style.display = 'block';
            window.alert(data);
        }
        window.addEventListener('popstate', function(event) {
            updateContent(event.state);
        });
        history.replaceState(data, 'Test','\Test04.html');
    </script> 
    </head> 

    <body> 
        <nav>
            <ul class="cf">
                <li><a href="#DivOne" onclick="clicked('divOne')">Div One</a></li>
                <li><a href="#DivTwo" onclick="clicked('divTwo')">Div Two</a></li>
            </ul>
        </nav>
        <div id="divOne" style="display: none">
            This is Div One
        </div>
        <div id="divTwo" style="display: none">
            This is Div Two
        </div>  
     </body> 
 </html>

HTML推送和流行历史记录

0 个答案: