История Api: Как сообщить браузеру, что страница загружается?

Я работал с историей api, а я загружаю страницы асинхронно через javascript/jquery. Мне интересно, как можно сообщить браузеру, что сайт загружается, чтобы браузер мог показывать загрузочное изображение (например, вращающееся колесо в firefox).

Edit:

Более конкретно:

Если я загружаю страницу на свой сайт, изменяется URL-адрес, отображается новое содержимое, но Firefox не показывает вращающееся колесо в качестве сигнала, что страница загружается.

Если я открою снимок с временной шкалы в Facebook, изображение загрузится, изменяется URL-адрес, и Firefox показывает вращающееся колесо, чтобы показать, что изображение загружается в фоновом режиме.

Я тоже хочу это вращающееся колесо!

Ответ 1

Я нашел ответ в этом вопросе:

Как заставить AJAX запускать загрузку браузера

var i = $('<iframe>');
console.log(i);
i.appendTo('body');
function start() {
    i[0].contentDocument.open();
    setTimeout(function() {
        stop();
    }, 1000);
}
function stop() {
    i[0].contentDocument.close();
    setTimeout(function() {
        start();
    }, 1000);
}

start();

Источник: jsFiddle

script создает iframe, который запускается с помощью событий ajax.start и ajax.stop.

Ответ 2

Ну, асинхронный запрос знает, что что-то загружается. Вам просто придется распространять событие в другом месте самостоятельно. Например, используя hook beforeSend:

$.ajax('/your_stuff', 
       beforeSend: function() {
         $(document).trigger('loading');
       }
       ....)

а затем:

$(document).on('loading', function() { alert("request is loading");}

Я бы посоветовал вам инициировать событие одновременно с обновлением URL-адреса API-интерфейсом истории.

Ответ 3

Я предполагаю, что из тегов вы используете jQuery для своего AJAX. Вы можете использовать глобальные обработчики AJAX, такие как $.ajaxStart() и $.ajaxComplete(). Они будут срабатывать независимо от того, где вы вызываете метод ajax в своем коде

$('#myLoadingDiv').ajaxStart(toggleLoading).ajaxComplete(toggleLoading);

function toggleLoading(){
   $(this).toggle();
}

Ссылка API http://api.jquery.com/ajaxStart/

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

EDIT. Вы должны предоставить свою собственную анимацию загрузки в элементе id=myLoadingDiv, чтобы этот код работал