programing

스크립트가 완전히 로드되어 실행되었을 때 jquery .getscript() 콜백

closeapi 2023. 2. 25. 21:00
반응형

스크립트가 완전히 로드되어 실행되었을 때 jquery .getscript() 콜백

jquery api 페이지 http://api.jquery.com/jQuery.getScript/ 에서와 같이

성공 콜백

콜백은 스크립트가 로드되면 실행되지만 반드시 실행되지는 않습니다.

$.getScript("test.js", function() {
    foo();
});

만약foo()함수는 test.displaces에 의존하며 정상적으로 실행할 수 없습니다.

Google map api에서도 비슷한 것을 보았습니다만, 그 경우 ajax 스크립트 URL에서 콜백 함수를 지정할 수 있습니다.그러나 일반적으로 콜백을 수행하기 위해 ajax 스크립트가 실행될 때까지 기다리는 확실한 방법이 있습니까?

오래된 질문인 것은 알지만, "done"을 포함한 두 답변 모두 소유자가 설명하지 않고 사실상 가장 좋은 답변이라고 생각합니다.

가장 많이 투표된 응답에서는 "async:false"를 사용해야 합니다.이것에 의해, 최적이 아닌 동기 콜이 작성됩니다.한편, jquery는 버전 1.5(아마 이전?)부터 도입되었습니다.이 경우 스크립트를 비동기적으로 로드하여 실행이 완료될 때까지 기다립니다.

정의에 의한 콜백 getScript 문서

콜백은 스크립트가 로드되면 실행되지만 반드시 실행되지는 않습니다.

대신 당신이 찾아야 할 것은 약속이 어떻게 작용하는가 하는 것이다.이 경우 비동기적으로 로드할 스크립트를 찾고 있을 때 "then" 또는 "done" 중 하나를 사용할 수 있습니다.이 스레드를 보면 그 차이를 알 수 있습니다.

기본적으로는 약속이 해결되었을 때만 완료가 호출됩니다.스크립트가 정상적으로 로드되어 실행이 종료된 경우.따라서 기본적으로 코드에는 다음과 같은 의미가 있습니다.

$.getScript("test.js", function() {
    foo();
});

다음으로 변경해야 합니다.

$.getScript("test.js").done(function(script, textStatus) {
    console.log("finished loading and running test.js. with a status of" + textStatus);
});

$.getScript(...)+setInterval(...)내 밑에서 일했어:

$.getScript('https://www.google.com/recaptcha/api.js')
  .done(function() {
    var setIntervalID = setInterval(function() {
      if (window.grecaptcha) {
        clearInterval(setIntervalID);
        console.log(window.grecaptcha);
        letsWorkWithWindowDotGreptcha();
      };
    }, 300);
  });


  function letsWorkWithWindowDotGreptcha() {
    // window.greptcha is available here....
  }

일단은variable우리가 찾고 있는 것은 정의되어 있다(내 경우)window.grecaptcha, 호출할 수 있습니다.closure function어느쪽이 될 수 있다abstracted out.

행운을 빈다...

에이잭스 사용 가능

jQuery.ajax({
        async:false,
        type:'GET',
        url:script,
        data:null,
        success:callback,
        dataType:'script'
    });

Async는 false입니다.스크립트를 로드하여 실행하고 싶기 때문에 콜백이 성공하면 함수 foo()를 호출할 수 있습니다.

$.getScript( "ajaxFile/myjs.js" )
.done(function( s, Status ) {
    console.warn( Status );
})
.fail(function( jqxhr, settings, exception ) {
    console.warn( "Something went wrong"+exception );
});

저는 오늘 같은 문제에 직면했고 약속과 인터벌 타이머에 기초한 해결책을 생각해 냈습니다.

$.getScript("test.js", function() {
    var $def = $.Deferred();
    if (typeof foo === 'undefined') { // "foo" isn't available
        var attempts = 0;
        // create an interval
        // that will check each 100ms if the "foo" function
        // was loaded
        var interval = setInterval(function() {
            if (typeof foo !== 'undefined') { // loaded
                window.clearInterval(interval);
                $def.resolve();
            }
            // after X unsuccessfull attempts, abort the operation
            else if (attempts >= 100) {
                window.clearInterval(interval);
                $def.reject('Something went wrong');
            }

            attempts++;
        }, 100);
    }
    else { // "foo" is available
        $def.resolve();
    }
    return $def.promise();
}).then(function() {
    // at this point "foo()" is definitely available.
}).fail(function() {
    // deal with the failure
});

ideia는 특정 변수를 노출하는 특정 스크립트를 로드하는 것입니다.foo아직 존재하지 않기 때문에 스크립트가 로딩된 후,getScript이 변수가 존재하는지 여부를 확인합니다.존재하지 않는 경우 변수를 사용할 수 있는지 지속적으로 확인하는 간격을 만듭니다.또한 이 조건이 충족될 경우에만 약속이 해결됩니다.

말한 바와 같이then,done$.getScript스크립트가 로드되어 실행되지 않았을 때 콜백이 발생합니다.인터벌은 이 문제를 해결하는 방법일 수도 있지만, 제 생각에는 그다지 우아하지 않은 것 같습니다.

이 솔루션은 비동기식으로 로드된 스크립트 내에서 다음과 같은 이벤트를 트리거합니다.

jQuery( document ).trigger( 'loadedeventsjs' );

메인 스크립트에서는 다음과 같이 이벤트에 바인드할 수 있습니다.

jQuery( document ).on( 'loadedeventsjs', function() {

    jQuery( '#mainmenu_wrapper' ).on( 'swiperight', menuout );

} );

그 해결책에는 의존성에 대한 여론조사가 필요합니다.또는 스크립트를 AMD와 같이 미리 정의된 콜백으로 래핑해야 합니다.

$getScript는 다음과 같이 사용

$.getScript( "js/jquery.raty.min.js" )
    .done(function( script, textStatus ) {
          console.log( textStatus );
         }
          });

이것은 나에게 잘 작동한다.

언급URL : https://stackoverflow.com/questions/14565365/jquery-getscript-callback-when-script-is-fully-loaded-and-executed

반응형