JQTOUCH, in ogni Momento del caricamento si verifica, aggiungere un caricamento della classe?

Question

Sto usando JQTOUCH e in JQTOUCH vari i link sono in fase di caricamento tramite AJAX e poi scivola.Il problema è che non c'è il caricamento indicazione fornita agli utenti.

Vorrei un modo per aggiungere un Caricamento della classe con un AJAX spinner, quando mai l'una chiamata ajax è in fase di caricamento, e hanno la classe rimosso quando il caricamento è terminato, e la pagina viene visualizzata.

Tutte le idee?

Answer 1

Questo è il comportamento di base se i link sono li class = elementi "freccia". come stai visualizzando i tuoi link e dove si desidera che il carico-filatore di visualizzazione?

Answer 2

il showPageByHref() la risposta è solo parzialmente corretta.

Ma, invece di

$('body').append('<div id="loadinginprogress">Loading...</div>');

Hai bisogno

$('.current').append('<div id="loadinginprogress">Loading...</div>');

Il corpo è troppo generale per jqtouch, devono essere specifici per la visualizzazione DIV-pagina

Answer 3

Funzione

showPageByHref () in js jQTouch è un buon inizio. ho aggiunto a destra in ajax chiamata così l'attesa si prega di non sfarfallio vi quando si fa clic sul collegamento che è già caricato etc.

In breve - add carico div (id loadinginprogress in exmaple) a destra prima della chiamata AJAX e rimuovere successivamente "successo" o "errore". la sezione chiamata ajax sarebbe simile a quella (abbreviato esso):

function showPageByHref(href, options) {
...
if (href != '#'){
    $('body').append('<div id="loadinginprogress">Loading...</div>');
    $.ajax({
        url: href,
        data: settings.data,
        type: settings.method,
        success: function (data, textStatus) {
            $('#loadinginprogress').remove()
            var firstPage = insertPages(data, settings.animation);
            if (firstPage)
            {
                if (settings.method == 'GET' && jQTSettings.cacheGetRequests && settings.$referrer)
                {
                    settings.$referrer.attr('href', '#' + firstPage.attr('id'));
                }
                if (settings.callback) {
                    settings.callback(true);
                }
            }
        },
        error: function (data) {
            $('#loadinginprogress').remove()
            if (settings.$referrer) settings.$referrer.unselect();
            if (settings.callback) {
                settings.callback(false);
            }
        }
    });
}
...
}

css per il carico div sarebbe qualcosa di simile:

#loadinginprogress {
    -webkit-border-radius: 10px;
    background-color: rgba(0,0,0,.5);
    color: white;
    font-size: 18px;
    font-weight: bold;
    height: 80px;
    left: 60px;
    line-height: 80px;
    margin: 0 auto;
    position: absolute;
    text-align: center;
    top: 120px;
    width: 200px;
    z-index: 5000;
}

Answer 4

Grazie per i vostri posti diversi. Mi hanno aiutato molto.

Ho una soluzione per proporre, senza l'applicazione di patch al codice jQTouch su cui si basa jQTouch. Esso utilizza le funzionalità Ajax jQuery.

$(document).ready(function() {
...
  $('#jqt').ajaxStart(function() {
    console.log("ajaxStart");
    ...
  }).ajaxSuccess(function() {
    console.log("ajaxSuccess");
    ... 
  }).ajaxError(function() {
    console.log("ajaxError");
    .... 
  });
....
});

maggiori dettagli disponibili in questa pagina doc jQuery .

Answer 5

Si potrebbe aggiungere un gestore di eventi personalizzati, e innescare l'everytime loading.gif il clic sull'elemento specifico è stato fatto.

Answer 6

Ho appena risposto di Darin Parker . Basta controllare fuori può aiutare a.