Динамические Элементы не появляются в IE8, пока нет щелчок мышью

У меня есть запрос Ajax, который возвращает результаты поиска, и я динамично создаю элементы DOM для отображения тех результатов. Это работает как ожидалось во всех браузерах, которые я протестировал за исключением IE8.

Запрос возвращается прекрасный, JavaScript работает успешно, и элементы создаются, но элементы не отображаются на странице. Они только появляются после щелчка мышью где-нибудь на странице.

Я запустил быстрый тест, который выполнил код обратного вызова без запроса Ajax, и он вел себя как ожидалось там. Таким образом, я задаюсь вопросом, имеет ли это некоторое отношение к пути, IE8 управляет потоком обратного вызова. Кто-либо еще видел поведение как это или имеет понимание на нем?

Обратный вызов существенно очень прост. Я воспроизвел с этим:

function catchResults(response) {
    var contentBlock = document.getElementById('divResults');
    var divResults = document.createElement('div');
    var txt = document.createTextNode("Results");
    divResults.appendChild(txt);
    contentBlock.appendChild(divResults);
}

Я использую JQuery.ajax для совершения вызова. Я видел правильное поведение в FireFox и Chrome.

Спасибо за справку!

11
задан TwainJ 28 July 2010 в 06:36
поделиться

1 ответ

Не так давно я столкнулся с этой проблемой в IE8.

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

Если contentBlock является родительским элементом, вы можете проверить следующее:

Версия Javascript:

// Variable storing the test class name
var testClass = "testClass";
// Add test class to element
contentBlock.className += " "+testClass;
// Remove test class from element
var reg = new RegExp('(\\s|^)'+testClass+'(\\s|$)');
contentBlock.className=contentBlock.className.replace(reg,' ');

Версия jQuery:

// Variable storing the test class name
var testClass = "testClass";
// Add test class to element and then remove it 
$('#divResults').addClass(testClass).removeClass(testClass);

Просто поместите его в конец функции после добавленияChild. Надеюсь, это решит вашу проблему.

Ссылка: http://www.openjs.com/scripts/dom/class_manipulation.php

14
ответ дан 3 December 2019 в 08:28
поделиться
Другие вопросы по тегам:

Похожие вопросы: