Ajax заменить текст с изображением - PullRequest
0 голосов
/ 27 октября 2008

Я собрал следующий скрипт 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

 });

вот HTML

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

с использованием moo 1.1.

Вышеприведенное работает отлично, страница загружается, затем запрос ajax запускается в div. Id log_res имеет класс ajax-loading во время его обновления, и после его завершения текстовое упражнение в div заменяется тем, что вернул ajax ( Yippee). Но я хочу поместить некоторый пользовательский HTML-код в div, пока страница загружается, потому что класса ajax-loading недостаточно для хранения информации, я также хочу поместить вращающуюся флешку в div, пока запрос ajax получает информацию , Надеюсь, что это имеет смысл!

Ответы [ 2 ]

3 голосов
/ 27 октября 2008

С MooTools 1.2 это работает как запрошено:

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

Поскольку вам неинтересно и вы используете MooTools 1.1, я должен немного покопаться ... На самом деле, я получил его, используя почти ту же настройку, что и вы (обратите внимание, я использую target вместо log, что определено вне области действия этой функции):

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();
}
1 голос
/ 28 октября 2008

Разве вы не можете сделать что-то вроде этого:

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

  //and the rest of the function
}
...