Ссылки Ajax в Internet Explorer 7 загружаются только один раз
Я пишу приложение и пытаюсь привязать к нему простую функциональность AJAX. Оно хорошо работает в Mozilla Firefox, но в Internet Explorer есть интересная ошибка: каждая ссылка может быть нажата только один раз. Браузер необходимо полностью перезапустить, просто перезагрузить страницу не получится. Я написал очень простой пример приложения, демонстрирующий это.
Javascript воспроизведен ниже:
var xmlHttp = new XMLHttpRequest();
/*
item: the object clicked on
type: the type of action to perform (one of 'image','text' or 'blurb'
*/
function select(item,type)
{
//Deselect the previously selected 'selected' object
if (document.getElementById('selected')!=null)
{
document.getElementById('selected').id = '';
}
//reselect the new selcted object
item.id = 'selected';
//get the appropriate page
if (type=='image')
xmlHttp.open("GET","image.php");
else if (type=='text')
xmlHttp.open("GET","textbox.php");
else if (type=='blurb')
xmlHttp.open("GET","blurb.php");
xmlHttp.send(null);
xmlHttp.onreadystatechange = catchResponse;
return false;
}
function catchResponse()
{
if (xmlHttp.readyState == 4)
{
document.getElementById("page").innerHTML=xmlHttp.responseText;
}
return false;
}
Любая помощь будет оценена по достоинству.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 8
Похоже, IE кэширует ответ. Если вы либо измените свои вызовы на методы POST, либо отправите соответствующие заголовки, чтобы сообщить IE не кэшировать ответ, он должен работать.
Заголовки, которые я отправляю, чтобы убедиться, что он не кешируется:
Pragma: no-cache
Cache-Control: no-cache
Expires: Fri, 30 Oct 1998 14:19:41 GMT
Обратите внимание, что срок годности может быть в любое время в прошлом.
Да, функцию PHP header () можно использовать для добавления этих
А в ColdFusion вы можете использовать тег cfheader для их передачи с использованием атрибутов name и value. По какой-то причине мне пришлось добавить no-store в Cache-Control, и, конечно, в IE 8 даже это не сработало, но, по крайней мере, это было в IE 7 и Firefox 3.
Это происходит потому, что Internet Explorer игнорирует директиву no-cache и кэширует результаты вызовов ajax. Затем, если следующий запрос идентичен, он просто обслуживает кешированную версию. Есть простой обходной путь - просто добавить случайную строку в конец вашего запроса.
xmlHttp.open("GET","blurb.php?"+Math.random();
По моему опыту, добавление всех трех заголовков, которые я опубликовал выше, предотвратит кеширование IE, без необходимости добавлять случайное число.
Проблема в том, что IE делает странные вещи, когда обработчик ответа устанавливается до вызова open. Вы не делаете этого для первого запроса xhr, но поскольку вы повторно используете объект xhr, при вызове второго open обработчик ответа уже установлен. Это может сбивать с толку, но решение простое. Создайте новый объект xhr для каждого запроса:
переместите:
var xmlHttp = new XMLHttpRequest();
внутри функции выбора.
Спасибо, это помогло. Однако следует отметить, что мне нужно переместить обработчик событий внутри функции, чтобы он имел возможность читать переменную xmlHttpRequest.
При более внимательном рассмотрении кажется, что это не решило проблему.
xmlHttp.open("GET","blurb.php?"+Math.random();
Я согласен с этим .. он отлично работает как решение этой проблемы. проблема в том, что кеширование URL-адресов IE7 было ужасным, игнорирование заголовка без кеширования и сохранение ресурса в его кеше, используя его URL-адрес в качестве ключевого индекса, поэтому лучшим решением является добавление случайного параметра к URL-адресу GET.
Прочтите раздел "Нет проблем" в [текст ссылки] [1] [1]: http://en.wikipedia.org/wiki/XMLHttpRequest
Заголовок ответа, который лучше всего сработал для меня в случае IE AJAX, - это Expires: -1, что, вероятно, не соответствует спецификации, но упоминается в статье поддержки Microsoft (Как предотвратить кеширование в Internet Explorer). Он используется вместе с Cache-Control: no-cache и Pragma: no-cache.
В jQuery.ajax вы можете установить для параметра "cache" значение false:
Используя Dojo, это можно сделать с помощью dojo.date.stamp, просто добавив к URL-адресу следующее:
"...&ts = " + dojo.date.stamp.toISOString(new Date())
Как именно вам установить эти заголовки? Могу ли я использовать функцию PHP header ()? Что-то в HTML? Я немного запутался.