아래와 같이 추가
function getScripts( scripts, onScript, onComplete )
{
this.async = true;
this.cache = false;
this.data = null;
this.complete = function () { $.scriptHandler.loaded(); };
this.scripts = scripts;
this.onScript = onScript;
this.onComplete = onComplete;
this.total = scripts.length;
this.progress = 0;
};
getScripts.prototype.fetch = function() {
$.scriptHandler = this;
var src = this.scripts[ this.progress ];
//console.log('%cFetching %s','color:#ffbc2e;', src);
$.ajax({
crossDomain:true,
async:this.async,
cache:this.cache,
type:'GET',
url: src,
data:this.data,
statusCode: {
200: this.complete
},
dataType:'script'
});
};
getScripts.prototype.loaded = function () {
this.progress++;
if( this.progress >= this.total ) {
if(this.onComplete) this.onComplete();
} else {
this.fetch();
};
if(this.onScript) this.onScript();
};
사용방법 : 아래 처럼 인스턴스를 생성하고 .fetch()로 실행 한다.
순서대로 스크립트를 로딩 시키기 때문에 순서를 지킬 필요가 있는 상황에서 유용하다.
var scripts = new getScripts(
['script1.js','script2.js'],
function() {
//부분 완료 콜백
},
function () {
//전체 로딩 완료 콜백
}
);scripts.fetch();
'JS > JavaScript' 카테고리의 다른 글
클로저의 남용으로 인한 메모리 누수 (0) | 2016.04.21 |
---|---|
트리 만들기 테스트 (0) | 2015.12.29 |
이미지 미리 보기 (0) | 2015.08.25 |
Editor 개발 관련하여 괜찮은 스크립트 (0) | 2015.08.04 |
[펌] 파이어폭스에서 마우스 드래그 막기 (0) | 2015.02.06 |