0

我正在使用动态 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>
4

3 回答 3

1

尝试使用history.js 之类的库来设置它。在内部，它将使用pushStateAPI，或者如果浏览器不支持，则回退到 url 片段。

于 2012-11-27T21:07:00.757 回答
1

您可以尝试在每个选项卡中添加一个 id，并在每次选择 div 时将其附加到对象或数组中。在点击事件之外定义一个数组history = [];，在您的点击事件中定义一个类似的数组

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

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

于 2012-11-27T22:24:09.380 回答
0

感谢大家的帮助，但是在摆弄了 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();
            }
        });
于 2012-11-28T07:30:43.917 回答