Как обработать нажатие кнопки «Назад» на Android в веб-приложении на одной HTML-странице с помощью PhoneGap?

Question

Я прочитал из документации, что мы можем обработать нажатие кнопки "Назад", используя следующий код:

document.addEventListener("backbutton", backKeyDown, true); 
function backKeyDown() { 
     // Call my back key code here.
    alert('go back!');
}

Меня беспокоит то, что у меня есть одна веб-страница HTML5, на которой у меня есть несколько тегов div, которые я анимирую с помощью jQuery в соответствии с параметром навигации, выбранным пользователем из параметров меню.

Как я могу в этом одностраничном веб-приложении обрабатывать нажатие кнопки "Назад" с помощью PhoneGap и показывать пользователю ранее анимированный div. Повторное нажатие на кнопку возврата снова приведет его к предыдущему div текущего предыдущего div: -)

Спасибо.

Answer 1

Я решил проблему, создав переменную глобального массива как

var myStack = new Array();

Затем, когда я нажимал на тег div, я вставлял прототип функции вместе с аргументами в переменную myStack. Например:

myStack.push(\"myfunction(args1, args2);\");

Затем, используя код, который я разместил в своем вопросе, внутри обработчика BackButton, я написал следующий код:

var divToShow = myStack.pop();
eval(divToShow);

Надеюсь, это поможет другим.

Answer 2

Я сделал реализацию в аналогично структурированном приложении phonegap.Моя ситуация была немного сложнее, потому что я загружал в html, а также внешние данные через ajax (а не просто показывать div).Я создал глобальный массив с именем history, который я использовал для отслеживания текущей позиции, а также предыдущих позиций (здесь позиция является самой последней вызванной функцией ajax, поэтому массив фактически хранит имена функций в виде текста).Правильная последовательность и комбинация методов массива .pop и .push дали мне полнофункциональную кнопку js back, которая хорошо масштабировалась и обрабатывала любые виды навигации вперед-назад, о которых я только мог подумать.

Answer 3

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

1. Имейте глобальную переменную, чтобы запомнить текущий идентификатор div, который виден.Например, если щелкнуть пункт меню x, задайте для этой глобальной переменной идентификатор id, который в данный момент отображается (перед отображением следующего элемента div, соответствующего пункту меню x).
2. При нажатии кнопки «Назад»значение глобальной переменной для идентификации предыдущего div.Скрыть текущий div и показать предыдущий.