jQuery Mobile - Проблемы с получением showPageLoadingMsg для работы с pagebeforeshow или pagebeforeceate

Я на второй неделе пытаюсь решить проблему с получением сообщения о загрузке для правильного отображения:-(

Мне просто очень трудно получить события pagebeforecreate или pagebeforeshow для запуска $.mobile.showPageLoadingMsg().

Вот ссылка на пример на jsfiddle:

    [http://jsfiddle.net/7fxQf/25/][1]

Обратите внимание, что jsFiddle ссылается на мобильную библиотеку 1.0b3.

Вот пример базового фрагмента кода, который должен работать, но не работает:

$('#mypageone').live('pagebeforecreate', function (event, ui) {
   alert('Just selected page one!');
   //HEY!!! the page load never pops up :-(
   $.mobile.loadingMessage = "this msg set on live pageshow from mypageone...";
   $.mobile.pageLoading();
   $.mobile.showPageLoadingMsg();
  calcLongList();  //simple list generation of a 1000 lines to screen
 //$.mobile.hidePageLoadingMsg();
});

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

... но если изменить только на "просмотр страницы", отобразится сообщение о загрузке, но, разумеется, через 5-10 секунд для создания списка:-( ... что, конечно, не то, что я хочу.

Кроме того, не имеет значения, если я закомментирую функцию calcLongList или нет... сообщение о загрузке страницы ведет себя одинаково: работает для 'pageshow'... но не для 'pagebeforeshow' или 'pagebeforecreate'... и Я дергаю себя за волосы, пытаясь понять, что я могу делать не так?

Любой совет или руководство, безусловно, будут оценены, спасибо заранее

Источник

4 ответа

Когда jQM показывает индикатор загрузки, он добавляет класс к html-объекту (.ui-loading), который он удаляет с помощью $.mobile.hidePageLoadingMsg(). Однако в некоторых случаях он не добавит этот класс в html (потому что не может - попробуйте добавить его вручную).

Простое (и немного грязное) исправление - добавление класса вручную не в объект html, а в тело:

$('body').addClass('ui-loading');

Чтобы удалить загрузочный счетчик, просто удалите класс снова:

$('body').removeClass('ui-loading');
Источник

Если у вас есть проблема с отображением текстового сообщения, попробуйте изменить текст настроек jquery mobile.js, видимый для TRUE файла, следующим образом:

(function( $, window ) {
    // DEPRECATED
    // NOTE global mobile object settings
    $.extend( $.mobile, {
        // DEPRECATED Should the text be visble in the loading message?
        loadingMessageTextVisible: **undefined**,

        // DEPRECATED When the text is visible, what theme does the loading box use?
        loadingMessageTheme: undefined,

        // DEPRECATED default message setting
        loadingMessage: undefined,

TO:

(function( $, window ) {
    // DEPRECATED
    // NOTE global mobile object settings
    $.extend( $.mobile, {
        // DEPRECATED Should the text be visble in the loading message?
        loadingMessageTextVisible: **true**,

        // DEPRECATED When the text is visible, what theme does the loading box use?
        loadingMessageTheme: undefined,

        // DEPRECATED default message setting
        loadingMessage: undefined,

AXL

Источник

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

Источник

У меня та же проблема. Я не уверен, вызвано ли это тем же или нет, но моя панель нижнего колонтитула встроена. Поэтому я прокручиваю до нижней части страницы, нажимаю на страницу для загрузки, а затем на следующей странице вызываю сообщение о загрузке (я делаю некоторую динамическую загрузку содержимого ajax). Похоже, что сообщения о загрузке нет, но это действительно так. У него просто "верхнее" значение около 1700 пикселей, поэтому я его не вижу. Когда я нажимаю ссылку на ту же самую страницу, которая находится вверху страницы, я вижу сообщение о загрузке в порядке.

Похоже, jQM пытается сохранить загрузочное сообщение или что-то в этом роде. Точно сказать не могу.

Итак, вот ваше руководство. У меня пока нет ответа, кроме как сделать что-то вроде:

$(".ui-loader").css({"top": "400px"});

Это, вероятно, то, что я сделаю. Надеюсь, это поможет!

РЕДАКТИРОВАТЬ

Это то, что я прекратил делать. Проверено и все работает. Когда я начинаю свой вызов ajax:

$(".ui-loader").css({"display": "block", "top": "252px !important" });

Когда вызов ajax завершается:

$(".ui-loader").css({ "display": "none" });

РЕДАКТИРОВАТЬ 2

Извините, после некоторого тестирования я понял, что вы не хотите устанавливать "display: block;" или "дисплей: нет;" используя функцию.css() jQuery. Это установит атрибут style для самого элемента и переопределит то, что хочет сделать jQM. Сделайте это вместо этого - при начале вызова:

$(".ui-loader").css({ "top": "252px !important" });
$.mobile.showPageLoadingMsg();

По окончании загрузки:

$.mobile.hidePageLoadingMsg();
Источник
Другие вопросы по тегам