Programing

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

lottogame 2020. 8. 14. 08:13
반응형

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


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

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


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

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

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

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

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

<script type="text/javascript">
  $(window).bind("load", function () {
    // Code here
  });
</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 함수를 실행 해 보셨습니까 ?

Perhaps you can use setTimeout() on the $().ready function you wanted to run, calling the functionality you wanted to load.

Or, use setInterval() and have the interval check to see if all the other load functions have completed (store the status in a boolean variable). When conditions are met, you could cancel the interval and run the load function.

참고URL : https://stackoverflow.com/questions/1012140/delaying-a-jquery-script-until-everything-else-has-loaded

반응형