Остановите загрузку изображений в событии hashchange через JavaScript или jQuery

Я использую плагин jQuery BBQ: Back Button & Query Library для создания страницы, которая извлекает динамическое содержимое при нажатии на ссылку. При нажатии на ссылку хэш изменяется и добавляется новый контент (поэтому действие по умолчанию при нажатии на ссылку) отключено.)

Эта часть работает просто отлично, но есть проблема.

Пример моей проблемы

Скажем, на "домашней" странице есть DIV, несколько изображений и список ссылок...

  • Первая страница
  • Страница вторая
  • Страница третья

Загрузка изображений может занять некоторое время, тем временем пользователь часто не будет ждать, пока они загрузятся полностью, и нажимает ссылку "Первая страница".

Это очищает содержимое "домашней" страницы и загружает содержимое "первой страницы". Это отлично работает.

Проблема в том, что изображения с "домашней" страницы по-прежнему загружаются в браузер, даже если пользователь перешел с "домашней" страницы.

Я знаю, что это происходит, потому что страница на самом деле не изменилась, и я использую взлом хеш-обмена плагина BBQ, но я хочу знать, есть ли способ в JavaScript сказать всем загружаемым в данный момент изображениям, чтобы они остановились на событии хэш-обмена?

?? Пример кода будет похож на...

$(window).bind('hashchange', function () {

    //code to stop images from loading

    // now load in new HTML content

});
Источник

2 ответа

Решение

Я протестировал это решение в WebKit (Chrome/Safari), Firefox и IE, и, похоже, оно работает.

Я использовал функцию, которая использует window.stop(); для большинства браузеров, и собственный способ IE сделать это, если браузер не поддерживает window.stop ()

Смотрите больше здесь: https://developer.mozilla.org/en/DOM/window.stop

Итак, для браузеров, которые его поддерживают (Firefox, WebKit), используйте:

window.stop();

Для IE используйте:

document.execCommand("Stop", false);

Однако будьте осторожны...

Это в основном похоже на нажатие кнопки "Стоп" в браузере, поэтому все загружаемое в настоящее время будет останавливаться, а не только изображения (как я хотел)

Итак, внутри...

$(window).bind('hashchange', function () {

});

Вот функция, которую я использовал...

function stopDownloads() {
    if (window.stop !== undefined) {
        window.stop();
    }
    else if (document.execCommand !== undefined) {
        document.execCommand("Stop", false);
    }   
}
Источник

Я вполне уверен, что это невозможно (но был бы рад, если бы ошибался).

Причина в том, что изображения, встроенные в ваш сайт, приводят к HTTP GET запросы отправляются на ваш сервер. Как только этот запрос будет отправлен, ваш сервер будет обрабатывать и отвечать на этот запрос, который будет обрабатываться браузером.

Теперь, если это возможно, я предполагаю, что это потребует либо прохождения каждого изображения и обнуления его src атрибут (который я не думаю, будет работать, потому что, как я уже сказал, запросы уже были отправлены). Либо так, либо вызывая какой-то (вероятно, зависящий от браузера) механизм, который останавливает загрузку изображения.

Источник
Другие вопросы по тегам