다른 모든 항목이 로드될 때까지 jquery 스크립트 지연
다른 자바스크립트(제어할 수 없는)를 포함하여 페이지의 다른 모든 것을 한 번만 실행하면 되는 jquery 스크립트가 있습니다.
저는 아마도 $(문서)에 대한 대안이 있을 것이라고 생각했습니다.준비는 되었지만 찾을 수가 없었어요.
가질 수 있습니다.$(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()
및 간격을 확인하여 다른 모든 로드 함수가 완료되었는지 확인합니다(상태를 부울 변수에 저장).조건이 충족되면 간격을 취소하고 로드 기능을 실행할 수 있습니다.
자바스크립트 프레임워크의 독특한 혼합 때문에 다른 프레임워크 중 하나가 제공하는 이벤트 청취자를 사용하여 스크립트를 시작해야 했습니다.
다음 스크립트는 다음을 보장합니다.my_finalFunction
페이지가 이미지, 스타일시트 및 외부 콘텐츠로 완전히 로드된 후 실행됩니다.
<script>
document.addEventListener("load", my_finalFunction, false);
function my_finalFunction(e) {
/* things to do after all has been loaded */
}
</script>
키루파는 적절한 시간에 코드를 실행하는 것에 대한 좋은 설명을 제공합니다. https://www.kirupa.com/html5/running_your_code_at_the_right_time.htm 을 참조하십시오.
언급URL : https://stackoverflow.com/questions/1012140/delaying-a-jquery-script-until-everything-else-has-loaded
'it-source' 카테고리의 다른 글
전자 메일 주소에서 고유 도메인 수를 계산하기 위한 MySQL 쿼리 필드 (0) | 2023.08.29 |
---|---|
Excel 2010 - 전체 셀이 아닌 하이퍼링크 텍스트만 (0) | 2023.08.29 |
볼 데이터를 보내는 동안 JsonMappingException을 가져오는 중 (0) | 2023.08.29 |
PowerShell은 어떤 언어입니까? (0) | 2023.08.29 |
전용 생성자가 있는 Java Springbean (0) | 2023.08.29 |