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

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

Это штрих-код нижнего колонтитула:

<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 Mobile я вижу предупреждающее сообщение, когда нажимаю кнопку «Назад». Но я не вижу предупреждающее сообщение, когда нажимаю кнопку «Вперед».

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

Спасибо.


javascript jquery-mobile
person Boris Avilov    schedule 05.05.2015    source источник

Ответы (1)


arrow_upward
0
arrow_downward

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

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

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