IE не отображает содержимое div

Question

Я написал приложение, используя HTML 5, и я не хочу показывать окно с ошибкой вместо страницы, когда кто-то заходит из IE. Когда он обнаруживает navigator.appName как Microsoft Internet Explorer, он скрывает все и показывает ошибку div, которая началась скрытой. Div выглядит следующим образом:

<div id='ieerror' style='display:none;width:500px;height:500px;border:3px solid #ff0000;position:absolute;top:50%;left:50%;margin-top:-250px;margin-left:-250px;'>
    <center>
        <h1 style='font-size: 30px;'>Internet Explorer is not supported by Aud!</h1><br /><br />
        <p>Internet Explorer does not support HTML 5 and therefore this application cannot run.<br />
        Please upgrade your browser. We suggest <a href='http://www.google.com/chrome'>Google Chrome</a>!</p>
    </center>
</div>

Проблема в том, что когда я захожу на страницу в IE, div появляется с рамкой, но в ней нет содержимого. Ничего внутри этого нет. Я пошел к view->source и посмотрел на него, и код все еще там, но ничего из этого не отображается. Как мне это исправить?

Answer 1

Не видя весь HTML-код страницы, трудно точно понять, что происходит (вы должны опубликовать URL-адрес, если страница доступна в Интернете!), Но вот как я могу подойти к этой проблеме:

1. Во-первых, я бы сделал тестовую копию страницы, так как отслеживание этого может повлечь за собой множество изменений HTML.
2. далее я бы убрал отображение: нет и закомментировал все сценарии для div, и просто для удовольствия я бы также изменил идентификатор div, чтобы удостовериться, что ни один сценарий его не касается. если содержимое div внезапно появляется, то проблема, вероятно, в вашем сценарии, а не в ваших стилях
3. Затем я удалил бы все стили (на элементе div и его дочерних элементах), чтобы увидеть, связана ли проблема со стилями или чем-то за их пределами.
4. Если содержимое div отображается со всеми удаленными стилями, начните добавлять обратно стили один за другим до тех пор, пока они снова не прервутся. Это не решит проблему, но, по крайней мере, укажет вам на виновника.
5. если содержимое div по-прежнему не отображается со всеми удаленными стилями, попробуйте удалить другие стили на странице. Например, закомментируйте включенные файлы CSS. Это предотвратит очевидные проблемы, такие как, например, определение элементов center во включенной таблице стилей в виде текста на белом фоне. Или менее очевидные проблемы, такие как унаследованное переполнение или стили переноса слов, приводящие к обрезанию или скрытию содержимого.
6. Если это тоже не сработает, то, скорее всего, проблема вызвана родительским элементом этого div. Так как он абсолютно позиционирован, не имеет значения, куда вы поместите его в DOM, поэтому попробуйте поставить ваш div как прямой дочерний элемент body. Это устранит любые проблемы с воспитанием детей.
7. Если ничего из этого не работает, попробуйте комментировать нашу или удалять все больше и больше со своей страницы, пока она не начнет работать. Поскольку вы знаете, что простое размещение этого HTML-кода на странице будет работать, вы знаете, что если вы урежете страницу в какой-то момент, она начнет работать.

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

Answer 2

IE может каскадно отображать "display: none;" вниз через дочерние элементы этого родителя. Попробуйте изменить свой JavaScript, чтобы также изменить свойство display этих элементов.

Answer 3

Вы можете попробовать Панель инструментов разработчика Internet Explorer , чтобы увидеть, есть ли какие-либо стили, примененные к вашему DIV, которые вы не собирались.

Answer 4

Я попробовал этот код в IE, и он работает, как и следовало ожидать, но только после того, как я вспомнил поставить

div.style.display = "block";

после div. Когда я ошибочно поставил его раньше, он выдал (тихую) ошибку.

Answer 5

Ваш стиль говорит, что дисплей: нет? Если вы удалите весь код стиля и вернетесь в IE, вы увидите какой-нибудь текст?