[JavaScript] MessageBox 사용자 정의 기사가 게시된 이후 많은 네티즌들이 서버 측에서 ShowInfo 메서드를 호출하는 방법에 대해 문의하는 글을 올렸습니다. 이를 달성하기 위한 절충 방법을 주말 동안 생각해 냈습니다.
우선, Page.Write를 사용하여 사용자 정의 JS 메소드를 페이지에 출력하는 이유와 IE가 이를 인식할 수 없고 "XXX가 정의되지 않았습니다" 오류가 나타나는 이유를 명확히 할 수 있어야 합니다. 이유는 간단합니다. Page.Write를 사용하여 출력한 스크립트가 페이지 상단에 나타나기 때문입니다. IE가 javascript 함수라고 읽으면 실행을 시작합니다. 하지만 현재 연결한 js 파일은 IE에서 읽혀지지 않기 때문에 IE는 js 파일에 정의한 메소드를 인식할 수 없습니다. 그렇다면 쓰기 경고는 왜 가능한 걸까요? Alert는 IE에 내장된 스크립트 기능이기 때문에 IE는 페이지 유무에 관계없이 이를 인식합니다.
문제를 찾으면 자연스럽게 해결됩니다.
1. 사용자 정의된 방법을 IE에 삽입합니다. ---> 좀 엉뚱한 것 같네요 ㅎㅎ
2. 페이지가 로드될 때까지 기다렸다가 이벤트를 실행하세요. --->트리거 이벤트, 그렇습니다.
페이지 로딩이 완료되었는지 어떻게 알 수 있나요?
1. 문서의 상태를 통해
2. 이벤트(windows.onload)에 의해 트리거됨
첫 번째는 덜 안전한 것 같습니다. 완전히 로드되었음에도 불구하고 여전히 데이터를 전송하고 있는 것으로 표시되는 경우가 있으므로(FF가 가장 확실한 상황) 이벤트를 사용하는 것이 더 안전합니다.
간단한 메소드를 정의하고, windows.onload에 마운트하고, 실행 시 표시합니다.
var loadComplete = false;
함수 로드완료()
{
로드완료=참;
}
window.attachEvent("onload",LoadCompleted);
하하, 이런 식으로 우리는 loadComplete를 판단하여 페이지가 로드되었는지 여부만 판단하면 됩니다.
var mImgdir = "";
var mCaption = "캡션";
var mMsg = "메시지";
var mOkClick= null;
함수 ShowMessage(imgdir,caption,msg,OkClick)
{
if(로드완료)
{
KMessageBox.ShowInfo(mImgdir,mCaption,mMsg,mOkClick);
}
}
이런 식으로 loadComplete가 false가 아닌 경우 KMessageBox.ShowInfo() 메서드를 실행하지 않지만 JS 오류 프롬프트는 표시되지 않습니다.
이것만으로는 충분하지 않습니다. 출력 스크립트는 페이지 출력 시 IE에서 한 번만 실행되지만 이때는 loadComplete=false이므로 페이지가 로드되었는지 정기적으로 감지해야 하기 때문입니다. 타이밍에 관해서는 setTimeout과 setInterval만 사용합니다. 여기서는 지속적인 감지가 필요하므로 setInterval 메소드를 사용합니다. 최종 코드는 다음과 같습니다.
var loadComplete = false;
var mImgdir = "";
var mCaption = "캡션";
var mMsg = "메시지";
var mOkClick= null;
var 타이머ID;
함수 ShowMessage(imgdir,caption,msg,OkClick)
{
if(로드완료)
{
KMessageBox.ShowInfo(mImgdir,mCaption,mMsg,mOkClick);
//이 이벤트를 언로드합니다. window.detachEvent("onload",function(){LoadCompleted;}) //타이밍 트리거 중지
window.clearInterval(timerID);
}
}
함수 LoadCompleted() { loadComplete=true }
window.attachEvent("onload",LoadCompleted);
//타이밍 감지 메커니즘 설정
타이머ID = window.setInterval(ShowMessage,1);
물론 위의 코드는 attachmentEvent와 detachEvent를 사용하기 때문에 IE에서만 호환됩니다. 다른 브라우저와 호환되게 만드는 방법은 [JavaScript] 제목 표시 방법 사용자 정의를 참조하세요.
if(!document.attachEvent)//IE가 아님
{
document.attachEvent = function(){document.addEventListener(arguments[0].substr(2),arguments[1],arguments[2])}
}
if(!window.attachEvent)//IE가 아님
{
window.attachEvent = function(){window.addEventListener(arguments[0].substr(2),arguments[1],arguments[2])}
}
서버 측에서는 StringBuilder가 위 스크립트를 생성한 다음 이를 작성하면 충분합니다. 위의 내용은 단지 아이디어일 뿐입니다. 물론 다른 방법도 있습니다. 예를 들어 저는 예약 감지를 사용하지 않고 windows.onload에 직접 마운트하여 페이지를 자동으로 모니터링하고 실행하도록 하는 것도 나쁘지 않습니다. :) 모든 길은 로마로 통한다 ~~
위의 아이디어는 yui에서 나온 것이며, yui는 더 아름다운 사용자 정의 MessageBox를 구현합니다. 관심 있는 친구들은 함께 공부할 수 있습니다.
http://www.cnblogs.com/walkingboy/archive/2006/08/28/autorun_customerfunction.html