Сохранить значение ввода текста в jQuery Mobile

Я обнаружил некоторое странное поведение в jQuery Mobile, которое я даже могу воспроизвести на демонстрационном веб-сайте:

  1. перейдите напрямую на http://jquerymobile.com/test/docs/forms/textinputs/
  2. введите что-нибудь в текстовый ввод
  3. щелкните любую ссылку на странице и наслаждайтесь анимацией ajax-y
  4. вернуться назад с помощью кнопки «Назад» в браузере

Результат: текст, введенный в поле ввода текста, все еще существует. Это то, чего я хочу.

Однако это прерывается, если вы заходите откуда-то на сайт:

  1. перейдите на страницу http://jquerymobile.com/test/docs/forms/.
  2. нажмите «Ввод текста»
  3. выполните шаги со 2 по 4 сверху

Результат: текст, введенный в поле ввода текста, исчез. Это не то, чего я хочу.

Я проверил это на Chrome для рабочего стола и эмуляторе Windows Phone, оба показывают одинаковое поведение. Что я могу сделать, чтобы всегда сохранять текст, введенный в текстовом вводе? В моем случае это окно поиска. Я хочу, чтобы пользователь мог уточнить условия поиска после перехода назад из результатов поиска без необходимости вводить все заново.


html back-button textinput jquery-mobile
person Stefan Paul Noack    schedule 24.04.2012    source источник

Ответы (3)


arrow_upward
4
arrow_downward

Это потому, что когда вы заходите из документов/форм, ajax вначале отключен. Итак, jQueryMobile отключает dom-cache. Вы можете принудительно кешировать dom, добавив это перед загрузкой jquerymobile.js:

$(document).bind("mobileinit", function() {
    $.mobile.page.prototype.options.domCache = true;
});

Изменить :

Мое решение работает, я только что попробовал:

  • Перейдите на мою демонстрационную страницу ;

  • Нажмите «Ввод текста»

  • Введите что-нибудь в «Ввод текста:»

  • Нажмите «Поиск» слева (в моей демонстрации работают только некоторые ссылки)

  • Вернитесь назад с помощью кнопки «Назад» в браузере

Ваш текст все еще там!

(Примечание. На этой странице показана исходная версия с проблемой , и так без domCache, чтобы доказать, что я больше ничего не менял, когда дублировал страницы jQueryMobile-Docs для своей демонстрации).

person Julien    schedule 30.04.2012
comment
Вау! Это работает просто отлично, спасибо! Вы получите награду через 16 часов. :) - person Stefan Paul Noack; 30.04.2012

arrow_upward
0
arrow_downward

Пожалуйста, попробуйте это, это спасло жизнь многим людям.

 $.extend(  $.mobile , {
        ajaxEnabled      : false,
        hashListeningEnabled: false
    });

Многое можно прочитать по следующей ссылке.

http://forum.jquery.com/topic/jquery-mobile-true-browser-back-button-issue

person Shaikh Farooque    schedule 30.04.2012
comment
Это вообще не решает проблему. На самом деле это приводит к тому, что он всегда забывает введенный текст. - person Stefan Paul Noack; 30.04.2012

arrow_upward
0
arrow_downward

Самый надежный способ, который я нашел, - это хранить ваши данные в локальном хранилище с помощью pagebeforehide и возвращать их при необходимости с помощью pagebeforeshow.

person flo850    schedule 02.05.2012