Блог

Главная - Вопросы по программированию - Документ Jquery, готовый для динамически загружаемого HTML, запускается рано

Документ Jquery, готовый для динамически загружаемого HTML, запускается рано

#javascript #jquery #html #ajax

#javascript #jquery #HTML #ajax

Вопрос:

Я загружаю динамический контент следующим образом:

 $('#my-div').load('my.html');

Внутри my.html является ли код таким

 <html>
    <head>
    </head>
    <body>
        <script>
            $(function(){
                alert('should fire later');});
        </script>
    </body>
    <script>
        alert('should fire first!');
    </script>
</html>

Изначально my.html был загружен внутри iframe, и все было хорошо.

Однако для рефакторинга и модернизации кода он был изменен на использование ajax load. Однако теперь порядок выполнения изменен на обратный, поскольку технически событие ready уже запущено на родительской странице.

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

Можно ли использовать загрузку jquery ajax и сохранить первоначально намеченный порядок выполнения скрипта?

Комментарии:

1. Загружаете ли вы свой HTML до document.ready? Или он загружается при выполнении какого-либо действия?

2. Антуан, я думаю, ты получил ответ, если я просто уберу $.load(«my.html «) вне события ready и просто встроите его, проблема исчезнет! И мне не нужно изменять общий код.

3. Рад, что смог помочь ^_^

Ответ №1:

Попробуйте это:

 <html>
    <head>
    </head>
    <body>
        <script>
            function later () {
                alert('should fire later');
            }
        </script>
    </body>
    <script>
        alert('should fire first!');
        later();
    </script>
</html>

Ответ №2:

Что произойдет , если вы проверите состояние загрузки таким образом ?

 <html>
    <head>
    </head>
    <body>
        <script>
            jQuery(window).load(function () {
        alert('page is loaded');
    });
        </script>
    </body>
</html>

Однако вы можете проверить состояние загрузки Ajax, используя этот подход :

  $( document ).ajaxComplete(function( event,request, settings ) {
$( "#my-div" ).append( "<span>Request Complete.</span>" );
});

Вы можете найти полезную информацию здесь: ajaxComplete()