jquery mobile history back

Question

На странице я использую js, чтобы показать и скрыть некоторые элементы. Но есть проблема, когда я использую браузер.

<div data-role="page"> 
    <div class="step1"> 
     step1 content... 
     <a href="javascript:void(0)" class="nextBtn">next</a> 
    </div> 
    <div class="step2" style="display:none"> 
     step2 content... 
     <a href="javascript:void(0)" class="okBtn">next</a> 
    </div> 
    <div class="step3" style="display:none"> 
     step3 content... 
     <a href="javascript:void(0)" class="goBtn">next</a> 
    </div> 
    <script> 
    some script... 
    $('.nextBtn').click(function(){ 
     ok = do something... 
     if(ok){ 
      $('.step1').hide(); 
      $('.step2').show(); 
     } 
    }); 
    $('.okBtn').click(function(){ 
     ok = do something... 
     if(ok){ 
      $('.step2').hide(); 
      $('.step3').show(); 
     } 
    }); 
    </script> 
</div> 

но если я использую браузер кнопка обратной связи. Есть проблема. Я имею в виду, когда отображается «step2», я нажимаю кнопку «Назад», я хочу перейти на «step1».

Answer 1

Я предлагаю вам использовать https://github.com/browserstate/History.js манипулировать историей браузера

Answer 2

Если вы хотите .step1 быть виден при загрузке страницы, вот код.

$(document).on('pagebeforeshow', '[data-role="page"]', function() { 
$('div.step1').show(); 
});