Как сделать кнопку вперед в jQuery Mobile

Question

В этом примере нам удается сделать кнопку «Назад», но кнопка «вперед» кажется проблемой: когда она нажата, она не работает.

Это сноска штрих-код:

<div data-role="footer" id="footer" data-theme="d" data-position="fixed"> 
    <div data-role="navbar" data-iconpos="left"> 
     <ul> 
      <li> 
       <a data-rel="back" data-icon="back" data-direction="reverse">Back</a> 
      </li> 
      <li> 
       <a data-rel="forward" data-icon="forward" data-direction="forward">Fwd</a> 
      </li> 
     </ul> 
    </div> 
</div><!-- Mobile Footer --> 

JavaScript:

$(window).on("navigate", function(event, data) { 
    alert(data.state.url); 
}); 

В браузере, если я нажимаю назад и вперед кнопки, то я могу увидеть предупредительное сообщение для обеих кнопок ,

На странице мобильного устройства jQuery я могу видеть предупреждающее сообщение, когда я нажимаю кнопку «Назад». Но я не вижу предупреждающее сообщение, когда я нажимаю кнопку «вперед».

Вы можете проверить приведенный выше код и сообщить мне, как я могу заставить кнопку «вперед» работать?

Спасибо.

Answer 1

Кнопка forward не работает, потому что data-rel="forward" не существует в JQuery Mobile (вы можете проверить документацию для data-relhere).

Однако вы можете имитировать кнопку браузера вперед, добавив эту функцию сами:

$(document).on("click", "[data-rel=forward]", function() 
{ 
    window.history.forward(); 
});