Domanda

Ho messo insieme il seguente script mootools

 window.addEvent('domready', function() {
    var shouts = "timed.php";
    var log = $('log_res');
    function updateData (url,target)
    {
        new Ajax(url,{
        method: 'get', 
        update: $(target), 
        onComplete: function() {
        log.removeClass('ajax-loading');}  }).request();
        log.empty().addClass('ajax-loading');
    }

    var update = function(){ updateData ( shouts, 'log_res' ); };
    update();           // call it immediately
    update.periodical(10000);   // and then periodically

 });

ecco l'html

<div id="AJAX">
    <h3>Ajax Response</h3>
    <div id="log_res">exercise</div>
</div>

sta usando moo 1.1.

Quanto sopra funziona benissimo, la pagina viene caricata, quindi la richiesta di ajax prende il via in id div log_res ha una classe di caricamento di ajax durante il suo aggiornamento, e quando termina l'esercizio di testo nel div viene sostituito con qualunque cosa sia stata restituita da ajax ( yippee). Ma voglio mettere un po 'di HTML personalizzato nel div QUANDO la pagina viene caricata, perché la classe di caricamento ajax non è sufficiente per contenere le informazioni, voglio anche inserire un lampeggiatore nel div mentre la richiesta ajax sta recuperando le informazioni . Spero che abbia un senso!

È stato utile?

Soluzione

Con MooTools 1.2, funziona come richiesto:

function updateData (url, target)
{
  var target = $(target);
  target.empty().addClass('ajax-loading');
  target.innerHTML = "Loading...";
  new Request({
    url: url, 
    method: 'get',
    onComplete: function(responseText) {
      target.removeClass('ajax-loading');
      target.innerHTML = responseText;
    }
  }).send();
}

Dato che non sei divertente e usi MooTools 1.1, devo scavare un po '... In realtà, l'ho fatto funzionare quasi con la stessa configurazione che hai (nota che uso target invece di < code> log , che è stato definito al di fuori dell'ambito di questa funzione):

function updateData (url, target)
{
  var target = $(target);
  target.empty().addClass('ajax-loading');
  target.innerHTML = "Loading...";
  new Ajax(url, {
    method: 'get',
    update: target,
    onComplete: function() {
      target.removeClass('ajax-loading');
    }
  }).request();
}

Altri suggerimenti

Non puoi fare qualcosa del genere:

function updateData (url, target)
{
  var target = $(target);
  target.innerHTML = 'Please wait...';

  //and the rest of the function
}
Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top