Задержка jquery script, пока все остальное не загрузится

У меня есть jquery script, который мне нужно запускать только один раз, когда все остальное на странице, включая некоторые другие javascripts (над которыми я не контролирую) закончил делать свою работу.

Я, возможно, был альтернативой $(document).ready, но я не смог его найти.

Ответы

Ответ 1

Оказывается, из-за своеобразной смеси фреймворков javascript, которые мне нужно было инициировать script с помощью прослушивателя событий, предоставляется одна из других фреймворков.

Ответ 2

У вас может быть $(document).ready() несколько раз на странице. Код запускается в последовательности, в которой он отображается.

Вы можете использовать событие $(window).load() для своего кода, так как это происходит после полной загрузки страницы и завершения всего кода в различных обработчиках $(document).ready().

$(window).load(function(){
  //your code here
});

Ответ 3

Несколько $(document).ready() будут стрелять сверху вниз на странице. Последний $(document).ready() будет срабатывать последним на странице. Внутри последнего $(document).ready() вы можете запустить новое настраиваемое событие для запуска всех остальных.

Оберните свой код в обработчик событий для нового настраиваемого события.

<html>
<head>
<script>
    $(document).on("my-event-afterLastDocumentReady", function () {
        // Fires LAST
    });
    $(document).ready(function() {
        // Fires FIRST
    });
    $(document).ready(function() {
        // Fires SECOND
    });
    $(document).ready(function() {
        // Fires THIRD
    });
</script>
<body>
... other code, scripts, etc....
</body>
</html>

<script>
    $(document).ready(function() {
        // Fires FOURTH
        // This event will fire after all the other $(document).ready() functions have completed.
        // Usefull when your script is at the top of the page, but you need it run last
        $(document).trigger("my-event-afterLastDocumentReady");
    });
</script>

Ответ 4

Этот кодовый блок решает мою проблему,

<script type="text/javascript">
  $(window).bind("load", function () {
    // Code here
  });
</script>

Ответ 5

Из здесь:

// Add jQuery 
var GM_JQ = document.createElement('script'); 
GM_JQ.src = 'http://jquery.com/src/jquery-latest.js';
GM_JQ.type = 'text/javascript'; 
document.getElementsByTagName('head')[0].appendChild(GM_JQ); 

// Check if jQuery loaded 
function GM_wait() 
{ 
    if(typeof unsafeWindow.jQuery == 'undefined') 
    { 
        window.setTimeout(GM_wait,100); 
    } 
    else 
    { 
        $ = unsafeWindow.jQuery; 
        letsJQuery(); 
    } 
} 

GM_wait(); 

// All your GM code must be inside this function 
function letsJQuery() 
{
    // Do your jQuery stuff in here    
}

Это будет ждать, пока jQuery будет загружен, чтобы использовать его, но вы можете использовать ту же концепцию, устанавливая переменные в своих других сценариях (или проверяя их, если они не являются вашим script), чтобы ждать, пока они не будут загружены в используйте их.

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

<script type="text/javascript" language="JavaScript"> 
    function js(url){
        s = document.createElement("script");
        s.type = "text/javascript";
        s.src = url;
        document.getElementsByTagName("head")[0].appendChild(s);
    }       

    js("/js/jquery-ui.js");
    js("/js/jrails.js");
    js("/js/jquery.jgrowl-min.js");
    js("/js/jquery.scrollTo-min.js");
    js("/js/jquery.corner-min.js");
    js("/js/jquery.cookie-min.js");
    js("/js/application-min.js");

    function JS_wait() {
        if (typeof $.cookie == 'undefined' || // set in jquery.cookie-min.js
            typeof getLastViewedAnchor == 'undefined' || // set in application-min.js
            typeof getLastViewedArchive == 'undefined' || // set in application-min.js 
            typeof getAntiSpamValue == 'undefined') // set in application-min.js
        { 
            window.setTimeout(JS_wait, 100); 
        }
        else 
        { 
            JS_ready(); 
        }
    }

    function JS_ready() {
        // snipped
    };

    $(document).ready(JS_wait);
</script>

Ответ 6

Вы пытались загрузить все функции инициализации с помощью $().ready, запустив функцию jQuery, которую вы хотели в последний раз?

Возможно, вы можете использовать setTimeout() в функции $().ready, которую вы хотели запустить, вызывая функциональность, которую вы хотели загрузить.

Или используйте setInterval() и проверьте интервал, чтобы проверить, завершены ли все остальные функции загрузки (сохранить статус в логической переменной). Когда условия выполнены, вы можете отменить интервал и запустить функцию загрузки.