Frage jQuery Mobile - Probleme beim Abrufen von showPageLoadingMsg, um mit pagevoreshow oder pagebeforceeate zu arbeiten


Ich bin in meiner zweiten Woche, in der ich versuche, das Problem zu lösen, eine Lade-Nachricht zu erhalten, um richtig anzuzeigen :-(

Ich habe gerade eine sehr harte Zeit, entweder die Ereignisse pagebeforecreate oder pagebeforeshow zu erhalten, um die $ .mobile.showPageLoadingMsg () auszulösen.

Hier ist ein Link zum Beispiel auf jsfiddle:

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

Beachten Sie, dass jsFiddle die mobile 1.0b3-Bibliothek referenziert.

Hier ist ein Beispiel für das grundlegende Code-Snippet, das funktionieren sollte, aber nicht:

$('#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();
});

Ich kann den Alarm auslösen, aber leider nicht die Lade-Nachricht, wenn eine Seite tatsächlich geladen wird.

... aber wenn nur auf "pageshow" geändert wird, wird die Lade-Meldung angezeigt, aber natürlich nach den 5-10 Sekunden dauert es, um die Liste zu erstellen :-( ... was ich nicht will.

Es spielt auch keine Rolle, ob ich die Funktion calcLongList auskommentiere oder nicht ... die Seite load msg verhält sich genauso: funktioniert für 'pageshow' ... aber nicht für 'pagebeforeshow' oder 'pagebeforecreate' ... und Ich ziehe mir die Haare aus und versuche herauszufinden, was ich falsch machen könnte?

Jeder Rat oder jede Anleitung wäre sicher dankbar, danke im Voraus


6
2017-09-14 16:52


Ursprung


Antworten:


Wenn jQM den Ladeindikator anzeigt, fügt es dem html-Objekt (.ui-loading), das mit $ .mobile.hidePageLoadingMsg () entfernt wird, eine Klasse hinzu. In einigen Fällen wird diese Klasse jedoch nicht zu html hinzugefügt (weil es nicht möglich ist - versuche es manuell hinzuzufügen).

Einfache (und etwas schmutzige) Korrektur fügt die Klasse manuell nicht zum html-Objekt hinzu, sondern zum body:

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

Um den Lade-Spinner zu entfernen, entferne einfach die Klasse erneut:

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

21
2017-10-19 07:22



Wenn Sie Probleme haben, eine Textnachricht anzuzeigen, versuchen Sie, jquery mobile.js so zu setzen, dass der Text in der TRUE-Datei sichtbar ist:

(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,

ZU:

(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


2
2017-11-23 10:05



Ich habe das gleiche Problem. Ich bin mir nicht sicher, ob es durch die gleiche Sache verursacht wird oder nicht, aber ich habe meine Footer-Symbolleiste als Inline. Also scrolle ich zum Ende der Seite, klicke auf die zu ladende Seite, dann auf der nächsten Seite trage die Lade-Nachricht aus (ich mache etwas dynamisches Ajax-Laden von Inhalten). Es sieht so aus, als ob die Lade-Nachricht nicht da ist, aber es ist tatsächlich. Es hat nur einen "oberen" Wert von etwas um 1700px, also sehe ich es nicht. Wenn ich auf einen Link zu der gleichen Seite oben auf der Seite klicke, sehe ich die Lade-Nachricht in Ordnung.

Es sieht so aus, als ob jQM versucht, die Lade-Nachricht oder etwas ähnliches zu erhalten. Nicht sicher.

Also ... da ist deine Führung. Ich habe noch keine Antwort für dich, außer etwas zu tun wie:

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

Das werde ich wahrscheinlich tun. Ich hoffe, das hilft!

BEARBEITEN

Das habe ich beendet. Getestet und es funktioniert. Wenn ich meinen Ajaxanruf starte:

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

Wenn der Ajax-Aufruf abgeschlossen ist:

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

BEARBEITEN 2

Sorry, nach einigen Tests habe ich herausgefunden, dass du nicht "display: block" einstellen willst. oder "display: none;" Verwenden der .css () jQuery-Funktion. Dadurch wird das style-Attribut für das Element selbst festgelegt und überschreibt, was jQM tun möchte. Tun Sie dies stattdessen - wenn Sie den Anruf starten:

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

Nach dem Laden:

$.mobile.hidePageLoadingMsg();

1
2017-09-29 17:40



Ich habe einige Tests gemacht und bei meinem Projekt war es ein Timing-Problem, wenn ich eine Verzögerung oder einen Fehler in den Code eingefügt habe, wurde der Wait-Spinner angezeigt. Wenn ich es entferne und das Protokoll zusammen mit der Benutzeroberfläche nachverfolgte, kann ich sehen, dass die UI Rendering nicht das Laden von Daten benötigt. Grüße Kim


1
2018-05-08 11:31