Window.location.href заставляет анимированный загрузчик gif замораживаться в Firefox

У меня есть ссылка, которая при нажатии перенаправляет пользователя на ту же страницу, кроме дополнительных параметров:

<a id="lnkExportToPDF" href="javascript:void(0)">Export</a>

$('#lnkExportToPDF').click(function (e) {
    e.preventDefault();
    window.location.href = path + 'users/export/' + parm1 + '/' + parm2;
});

На стороне сервера я обрабатываю его, проверяя "экспорт" в пути запроса, и если он нашел, я пишу PDF файл в ответ:

System.Web.HttpResponse response = System.Web.HttpContext.Current.Response;
response.Clear();
response.AddHeader("Content-Type", "application/pdf");
response.AddHeader("Content-Disposition", String.Format("attachment; filename=" + filename + ".pdf; size={0}", buffer.Length.ToString()));
response.BinaryWrite(buffer);
response.End();

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

Что может быть причиной этого? Есть ли способ обновить/перезагрузить страницу /javascript после завершения ответа?

edit: Я нашел полезный JS-инструмент здесь: http://fgnass.github.io/spin.js/, но я бы предпочел не использовать его, если абсолютно необходимо

edit2: Я также попытался использовать общий обработчик (.ashx) для обработки запроса (т.е. изменения href, чтобы указать на обработчик), но как только перенаправление страницы и файл написано, то же самое происходит

edit3: Проблема только в Firefox. Я пробовал Chrome и IE, а gif остается анимированным в этих браузерах. (последние версии каждого)

edit4: Если я использую iframe с src в качестве изображения, он решает проблему, но он очень взломан, и стиль его выглядит по-разному во всех браузерах по отношению к центрированию/заполнению/полям.

edit5: Да. Если я осмотрю замороженный gif с помощью firebug, он волшебным образом разморозит себя.

Ответы

Ответ 1

Мне удалось воссоздать проблему в firefox, и я действительно не могу найти способ "разморозить" gif. Когда после загрузки я добавил совершенно другой файл, и это тоже было заморожено, я отказался от этого подхода.

Вместо этого я решил протестировать различные способы запуска загрузки. Я не нашел никаких window.location решений, которые работали, что работало, хотя это было:

window.open(path + 'users/export/' + parm1 + '/' + parm2);

window.open открывает новую вкладку и загружает файл, а не текущую вкладку, как window.location. Он вернется на текущую вкладку, как только начнется загрузка.

Изменить

Вы также можете использовать скрытый iframe:

var iframe = document.getElementById('iframe');
iframe.src = path + 'users/export/' + parm1 + '/' + parm2;

Ответ 2

Я подтверждаю, что у меня такое же поведение с firefox, и первое, что приходит мне в голову, это использовать SetTimeOut, но все равно такое же поведение, поэтому по firefox по какой-то причине этот window.location.href также вызывает "Stop", в браузере, чтобы это остановило анимацию gif.

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

И если вы измените свой код, вы можете архивировать тот же эффект со ссылкой.

Итак, измените этот

$('#lnkExportToPDF').click(function (e) {
    e.preventDefault();
    window.location.href = "page.aspx";
});

к чему-то вроде этого

$('#lnkExportToPDF').attr("href", "page.aspx");

и у вас есть те же результаты, и gif все равно будет двигаться.

Вот тест скрипки.
В тесте я добавляю, чтобы перейти на paypal, потому что он медленно перемещается, и вы можете видеть остановку анимации или нет, а также pp не показывать на iframe, поэтому, например, вы остаетесь на примере и не загружаете страницу.

Когда вы нажимаете этот пример, проблема появляется только в firefox!

http://jsfiddle.net/hn7S9/4/

Еще одна проблема, которая, по моему мнению, заключается в том, что, если вам нужно сделать свои параметры на следующей странице при щелчке, вам, вероятно, придется переделать и исправить их до вашего клика. Это возможно, потому что наверняка не зависит от последнего нажатия на ссылку динамического создания. Поэтому перед кликом сделайте ссылку со своими параметрами.

Ответ 3

Вы можете попробовать асинхронный подход при щелчке, чтобы позволить обозревателю обозревать очередь событий после запуска клика:

$('#lnkExportToPDF').click(function (e) {
    e.preventDefault();

    setTimout(function() {
        window.location.href = path + 'users/export/' + parm1 + '/' + parm2;
    }, 20);
});

Ответ 4

Как разрешить ссылку на огонь, но открыть его на новой вкладке? Это не должно прерывать что-либо о gif и является семантически прекрасным, за исключением того, что я предполагаю, что он оставит вкладку открытой. Вы можете избавиться от содержимого-распоряжения и разрешить браузеру/пользователю решать, что с ним делать, хотя.

<a id="lnkExportToPDF" target="_blank">Export</a>

$('#lnkExportToPDF').click(function (e) {
    $(this).attr("href", path + 'users/export/' + parm1 + '/' + parm2);
});

Ответ 5

Вот мое решение. Это быстрее и легче, чем любое исправление или обходной путь, который я нашел. Просто откройте страницу проблем в Chrome. У Chrome есть свои проблемы, но это не один из них. Всякий раз, когда я сталкиваюсь с страницей, полной gif, которая заставляет Firefox замораживаться, я просто копирую URL-адрес, закрываю вкладку, открываю Chrome и вставляю URL. Я работаю каждый раз!: О)