[javascript] 다른 모든 것이로드 될 때까지 jquery 스크립트 지연

Program / 글쓴이

나는 다른 자바 스크립트 (내가 제어 할 수없는)를 포함하여 페이지의 다른 모든 것을 한 번만 실행 해야하는 jquery 스크립트가 있습니다.

나는 아마도 $ (document) .ready에 대한 대안이 있었지만 그것을 찾을 수 없었습니다.

답변

$(document).ready()한 페이지에 여러 번 있을 수 있습니다 . 코드는 나타나는 순서대로 실행됩니다.

$(window).load()페이지가 완전히로드되고 다양한 $(document).ready()핸들러 의 모든 코드가 실행을 마친 후에 발생하므로 코드에 이벤트를 사용할 수 있습니다 .

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

답변

이 코드 블록은 내 문제를 해결합니다.

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

스 니펫 확장

답변

다중 $(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>

답변

에서 여기 :

// 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's 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가로드 될 때까지 기다릴 것입니다. 그러나 동일한 개념을 사용하여 다른 스크립트에서 변수를 설정 (또는 스크립트가 아닌 경우 확인)하여로드 될 때까지 기다릴 수 있습니다.

예를 들어, 내 사이트에서 나는 비동기 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>

답변

다른 프레임 워크 중 하나에서 제공하는 이벤트 리스너를 사용하여 스크립트를 시작하는 데 필요한 자바 스크립트 프레임 워크의 특이한 혼합 때문에 밝혀졌습니다.

답변

을 사용하여 모든 초기화 함수를로드하고 $().ready마지막으로 원하는 jQuery 함수를 실행 해 보셨습니까 ?

로드하려는 기능을 호출하여 실행하려는 함수 setTimeout()에 사용할 수 있습니다 $().ready.

또는을 사용 setInterval()하고 간격을 확인하여 다른 모든로드 기능이 완료되었는지 확인합니다 (부울 변수에 상태 저장). 조건이 충족되면 간격을 취소하고로드 기능을 실행할 수 있습니다.

답변