Проблемы с браузером Microsoft Edge при загрузке iframe в document.ready? - PullRequest
0 голосов
/ 26 марта 2019

У меня есть следующий HTML-файл:

<html>
    <head>
        <title>title</title>
        <script src="jquery-1.11.0.min.js"></script>
    </head>
    <body>
        <div id="mydiv">
        </div>
        <script>
            $(document).ready(function () {
                console.dir('iframe start');
                document.getElementById("mydiv").innerHTML = '<iframe id="xy" src="<url>" style="width: 100%; height: 100%; overflow: hidden;"></iframe>';
                console.dir('iframe end');
            });
        </script>
    </body>
</html>

Когда я запускаю эту страницу в Edge, она работает. Он загружает URL (который я пропустил), а все остальное работает нормально.

Однако, когда я нажимаю клавишу F12, чтобы увидеть инструменты разработчика, особенно вывод консоли, я не вижу «начало iframe» и «конец iframe» в консоли, а когда я перезагружаю страницу, она не больше не работает, iframe вообще не загружается.

Когда я закрываю инструменты разработчика и затем обновляюсь, он снова работает.

Все это прекрасно работает в Firefox или Chrome.

Почему открытие инструментов разработчика имеет какое-либо значение?

1 Ответ

0 голосов
/ 27 марта 2019

Я пытаюсь сделать тест с JQuery 3.3.1, и он отлично работает с MS Edge.

Еще одна вещь, которую я заметил, что вы используете Console.Dir для печати простого текста.

Console.Dir Отображает интерактивный список свойств указанного объекта JavaScript.Вывод представлен в виде иерархического списка с раскрывающимися треугольниками, которые позволяют вам видеть содержимое дочерних объектов.

Другими словами, console.dir - это способ увидеть все свойства указанного объекта JavaScript в консоли с помощьюкоторый разработчик может легко получить свойства объекта.

Ссылка:

Console.dir ()

Я пытаюсь заменить console.dir с Console.log , который решает проблему.

Код:

<!doctype html>
    <head>
        <title>title</title>
       <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    </head>
    <body>
        <div id="mydiv">
        </div>
        <script>
            $(document).ready(function () {
                console.log('iframe start');
                document.getElementById("mydiv").innerHTML = '<iframe id="xy" src="demo.html" style="width: 100%; height: 100%; overflow: hidden;"></iframe>';
                console.log('iframe end');
            });
        </script>
    </body>
</html>

Выход в MS Edge:

enter image description here

...