Добавление кнопок "Назад"
В jQuery Mobile есть функция автоматического создания и добавления кнопок "назад" к любому заголовку, хотя по умолчанию она отключена.Это в первую очередь полезно в установленных приложениях без Chrome, таких как те, которые работают в веб-представлении собственного приложения.Фреймворк автоматически генерирует кнопку «назад» в заголовке, когда опция addBackBtn в плагине страницы имеет значение true.Это также можно установить с помощью разметки, если у div страницы есть атрибут data-add-back-btn = "true".
Если вы используете атрибут data-rel = "back" на привязке, любые щелчкина этом якоре будет имитировать кнопку «Назад», возвращаясь к одной записи в истории и игнорируя href по умолчанию для якоря.Это особенно полезно при переходе по ссылке на именованную страницу, например при ссылке «home», или при создании кнопок «назад» с JavaScript, например, при закрытии диалога.При использовании этой функции в исходной разметке обязательно предоставьте содержательную ссылку, которая фактически указывает на URL ссылающейся страницы (это позволит этой функции работать пользователям в браузерах C-Grade . Такжепожалуйста, имейте в виду, что если вы просто хотите обратный переход без фактического возврата в историю, вы должны использовать вместо этого атрибут data-direction = "reverse".
Источник: http://jquerymobile.com/demos/1.1.0-rc.1/docs/toolbars/docs-headers.html
Раньше он был включен по умолчанию, но для большего количества людей было больше смысла отключать его по умолчанию.
Ваш HTML-код может измениться на:
<div data-add-back-btn="true" data-role="page">
...
</div><!-- /page -->
Вот демо: http://jsfiddle.net/nHgu7/1/
Вы также можете привязать к событию mobileinit, чтобы установить значение по умолчанию для addBackBtn:
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script>
$(document).bind("mobileinit", function() {
$.mobile.page.prototype.options.addBackBtn = true;
});
</script>
<script src="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.js"></script>
Вот демо: http://jsfiddle.net/nHgu7/2/
Источник: http://forum.jquery.com/topic/can-t-get-mobile-addbackbtn-to-work
Обновление
Вы можете автоматически добавить кнопку домой на каждую страницу, например:
//attach an event handler to any `data-role="page"` element at any time for the `pageinit` event
//(the event that fires when the page is about to be initialized)
$(document).delegate('[data-role="page"]', 'pageinit', function () {
//check for a `data-role="header"` element to add a home button to
var $header = $(this).children('[data-role="header"]');
if ($header.length) {
//create a link with a `href` attribute and a `class` attribute,
//then turn it into a jQuery Mobile button widget
$header.append($('<a />', { class : 'ui-btn-right', href : '#zero' }).buttonMarkup({ icon: "home", iconpos : "notext" }));
}
});
Вот демо: http://jsfiddle.net/nHgu7/3/
И если вы просто добавите оператор if, который проверяетИдентификатор домашней страницы: вы можете добавить домашнюю кнопку ко всем, кроме домашней страницы:
$(document).delegate('[data-role="page"]', 'pageinit', function () {
//check to see if this is the homepage, if so do nothing
if (this.id != 'home') {
var $header = $(this).children('[data-role="header"]');
if ($header.length) {
$header.append($('<a />', { class : 'ui-btn-right', href : '#zero' }).buttonMarkup({ icon: "home", iconpos : "notext" }));
}
}
});
Вот демоверсия: http://jsfiddle.net/nHgu7/4/