Ожидание с $ (document) .ready, $ (element) .ready и windows .load всего триггера, прежде чем содержимое будет готово - PullRequest
0 голосов
/ 17 апреля 2020

Не могли бы вы помочь мне отложить выполнение моей функции до загрузки контента? Я упорядочил свой код до основных, терпите мои опечатки:

function Phase1()
{
	$(".Hidden").load("hidden.html");
	$(window).load(Phase2());

/* I've also tried $(document).ready(Phase2()); */
/* and $(."Hidden").load("hidden.html",Phase2()); */
/* and window.onload... */

}
	
function Phase2()
{
    var Loop;
    var Source_Array = document.getElementsByClassName("Random");
    for (Loop=0;Loop<Source_Array.length,Loop++)
    { alert(Source_Array[Loop].innerHTML; };
}

Класс Random содержит несколько элементов. На первом проходе оповещения никогда не вызываются (длина равна 0), на 2-й итерации было время загрузить все.

Я не вижу ошибок в консоли при выполнении.

Ответы [ 2 ]

0 голосов
/ 17 апреля 2020

Страница будет загружать элементы сверху вниз.

Если вы хотите, чтобы ваш код JS выполнялся после загрузки всех элементов, вы можете попробовать выполнить одно из следующих действий:

  1. Переместите ваш скрипт в конец страницы.

<html>
      <head></head>
      <body>
          <!-- Your HTML elements here -->
          <script>
            // Declaring your functions
            function Phase1()
            {
              $(".Hidden").load("hidden.html");

            }
	
            function Phase2()
            {
                var Loop;
                var Source_Array = document.getElementsByClassName("Random");
                for (Loop=0;Loop<Source_Array.length,Loop++)
                { alert(Source_Array[Loop].innerHTML; };
            }
            
            // Executing your functions in that order.
            Phase1();
            Phase2();
          </script>
      </body>
  </html>

Свяжите свои функции с документом, готовым с помощью Vanilla JS.

document.addEventListener("DOMContentLoaded", function() {
    Phase1();
    Phase2();
});

Свяжите свои функции с документом с помощью jQuery.

$(document).ready(function() {
    Phase1();
    Phase2();
});
0 голосов
/ 17 апреля 2020

У меня есть небольшое и аккуратное решение для вашей проблемы, все, что вам нужно сделать, это

Вызвать setInterval для очень короткого промежутка, чтобы проверить, присутствует ли элемент в DOM или нет, если это не ваш интервал go будет включен, как только элемент появится, активирует ваши функции и очистит этот интервал.

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

 var storeTimeInterval = setInterval(function() {
     if (jQuery('.yourClass').length > 0) {
       //do your stuff here..... and then clear the interval in next line
       clearInterval(storeTimeInterval);
     }
  }, 100);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...