Question

我正在使用动态div内容并在点击之间切换，效果很好但有没有办法在用户在浏览器上向前和向后点击时保留上次查看的div？感谢。

     <script>
          $(".settings").click(function() {
            var id = this.id;
            if ($("." + $(this).attr('rel')).css('display') == 'none') {
                $('.n_tab').hide();
                $('.p_tab').hide();
                ($("." + $(this).attr('rel')).show());
            }

        });
     </script>

     <div class="settings" rel="n_tab">
            <div class="title info_2_Title">
                Notifications</div>
     </div>
     <div class="settings" rel="p_tab">
            <div class="title info_2_Title">
                Privacy</div>
     </div>

     <div id="MasterContainer">
       <div class="n_tab" style="display: none;"> the N DIV </div>
       <div class="p_tab" style="display: none;"> the P DIV </div> 
     </div>

Answer 1

尝试使用像history.js这样的库进行设置。在内部，它将使用pushState API，或者如果浏览器不支持，则回退到url片段。

Answer 2

您可以尝试向每个标签添加一个ID，并在每次选择div时将其附加到对象或数组中。在click事件之外和单击事件中定义数组history = [];，如

history.push($(this).id);

如果您想保留更详细的数据，可以使用json对象并附加到它。

Answer 3

感谢帮助人员，但是在摆弄了History.js之后，我仍然无法让它工作，最后我使用cookie来存储状态，然后在动态div加载页面时检查它

 $(function() {
            var x = $.cookie('tab_cookie');
            ($(x).show());
            if (x == '.m_tab') {
                var btn = document.getElementById('<%= btnLoadm.ClientID %>');
                if (btn) btn.click();
            }
        });

动态div内容+在浏览器后退保留最后查看的div

3 个答案: