먼저 window.showModalDialog의 기본 사용법부터 살펴보겠습니다
showModalDialog()(IE 4에서 지원)
showModelessDialog()(IE 5에서 지원)
window.showModalDialog() 메서드는 HTML 콘텐츠를 표시하는 모달 대화 상자를 만드는 데 사용됩니다.
window.showModelessDialog() 메서드는 HTML 콘텐츠를 표시하는 비모달 대화 상자를 만드는 데 사용됩니다.
사용법:
vReturnValue = window.showModalDialog(sURL [, vArguments] [,sFeatures])
vReturnValue = window.showModelessDialog(sURL [, vArguments] [,sFeatures])
매개변수 설명:
sURL--필수 매개변수, 유형: 문자열. 대화 상자에 표시할 문서의 URL을 지정하는 데 사용됩니다.
vArguments--선택적 매개변수, 유형: 변형. 대화 상자에 매개변수를 전달하는 데 사용됩니다. 배열 등을 포함하여 전달되는 매개변수 유형은 제한되지 않습니다. 대화 상자는 window.dialogArguments를 통해 전달된 매개변수를 가져옵니다.
sFeatures--선택적 매개변수, 유형: 문자열. 대화 상자의 모양과 기타 정보를 설명하는 데 사용되며 다음 중 하나 이상을 세미콜론 ";"으로 구분하여 사용할 수 있습니다.
1.dialogHeight:대화 상자의 높이는 100px 이상입니다. IE4에서는 대화 상자 높이 및 대화 상자 너비의 기본 단위가 em이고 IE5에서는 편의상 모달을 정의합니다. 모드 대화 상자 때 단위는 px를 사용합니다.
2.dialogWidth: 대화상자 너비.
3.dialogLeft: 화면 왼쪽으로부터의 거리입니다.
4.dialogTop: 화면과의 거리.
5.center: {yes | no | 0}: 창이 중앙에 있는지 여부는 기본값이지만 높이와 너비는 계속 지정할 수 있습니다.
6.help: {yes | no 1 | 0}: 도움말 버튼 표시 여부, 기본값은 yes입니다.
7.ressible: {예 | 아니요 1 | 0 } [IE5]: 크기를 조정할 수 있는지 여부. 기본값은 아니오입니다.
8.status: {yes | no 1 | 0} [IE5]: 상태 표시줄을 표시할지 여부입니다. 기본값은 yes[Modal] 또는 no[Modal]입니다.
9.scroll:{ yes | no | 0 | off }: 대화 상자에 스크롤 막대가 표시되는지 여부를 나타냅니다. 기본값은 예입니다.
다음 속성은 HTA에서 사용되며 일반적으로 일반 웹페이지에서는 사용되지 않습니다.
10.dialogHide:{ yes | no | 1 | 0 | off }: 인쇄 또는 인쇄 미리보기 중에 대화 상자를 숨길지 여부입니다. 기본값은 아니오입니다.
11.edge:{ sunken raise }: 대화 상자의 테두리 스타일을 지정합니다. 기본값은 증가합니다.
12.unadorned:{ 예 | 아니요 1 | 끄기 }: 기본값은 아니요입니다.
매개변수 전달:
1. 매개변수를 대화 상자에 전달하려면 vArguments를 통해 전달됩니다. 유형에는 제한이 없습니다. 문자열 유형의 경우 최대 길이는 4096자입니다. 예를 들어, 객체를 전달할 수도 있습니다.
showModalDialog: 열린 후에는 입력 포커스가 항상 유지됩니다. 대화 상자를 닫지 않으면 사용자는 기본 창으로 전환할 수 없습니다. 경보의 작동 효과와 유사합니다.
showModelessDialog: 열린 후 사용자는 입력 포커스를 무작위로 전환할 수 있습니다. 메인창에는 아무런 영향을 끼치지 않습니다.(기껏해야 한동안 차단되어 있습니다. :P)
2. showModalDialog 및 showModelessDialog의 하이퍼링크가 새 창에 표시되는 것을 방지하는 방법은 무엇입니까?
열린 웹페이지에
3. showModalDialog 및 showModelessDialog의 콘텐츠를 새로 고치는 방법은 무엇입니까?
showModalDialog 및 showModelessDialog에서는 F5를 눌러 새로 고칠 수 없으며 메뉴가 팝업되지 않습니다. 이는 javascript에만 의존할 수 있습니다. 관련 코드는 다음과 같습니다.
filename.htm을 웹페이지 이름으로 바꾸고 F5 키를 눌러 새로 고치세요. 그렇지 않으면
4. javascript를 사용하여 showModalDialog(또는 showModelessDialog)로 열린 창을 닫는 방법.
또한
5. showModalDialog 및 showModelessDialog의 데이터 전송 기술.
(작가노트: 원래는 문답형식으로 쓰고 싶었는데 어떻게 물어봐야 할지 몰라서 이렇게 하게 되었습니다.)
이건 꽤 번거로운 일인데 몇 번이나 바꿔서 설명을 못 하는 게 아니라(언어 실력이 점점 안 좋아지고 있어요) 예를 들어 설명해야겠습니다.
예: 이제 showModalDialog(또는 showModelessDialog)에서 var_name
변수를 읽거나 설정해야 합니다.일반 전달 방법:
window.showModalDialog("filename.htm",var_name)
//var_name 변수 전달
showModalDialog(또는 showModelessDialog)에서 읽고 설정하는 경우 :
alert(window.dialogArguments)//var_name 변수 읽기
window.dialogArguments="oyiboy"//var_name 변수 설정
이 방법은 만족스럽지만 var_name을 조작하려는 경우는 어떻습니까? 두 번째 변형 var_id가 동시에 작동합니까? 더 이상 운영할 수 없습니다. 이것이 이 배송 방법의 한계입니다.
제가 추천하는 전달 방법은 다음과 같습니다.
window.showModalDialog("filename.htm",window)
//어떤 변수를 조작하든 관계없이, 그냥 직접 전달하세요. 기본 창의 창 개체
를 showModalDialog(또는 showModelessDialog)로 읽고 설정한 경우:
alert(window.dialogArguments.var_name)//var_name 변수 읽기
window.dialogArguments. var_name="oyiboy"/ /var_name 변수 설정
동시에 var_id 변수도 조작할 수 있습니다
alert(window.dialogArguments.var_id)//var_id 변수 읽기
window.dialogArguments.var_id="001" //var_id 변수 설정
양식 개체의 요소 등 기본 창의 모든 개체에 대해 작업을 수행할 수도 있습니다.
window.dialogArguments.form1.index1.value="index1 요소의 값을 설정하는 것입니다."
상위 페이지에서 onClick=""var reVal = window.showModalDialog('changephoto.htm','dialogWidth:500px;dialogHeight:300px;help:no' 사용 );if (typeof(reVal) != 'undefine') {form.textname.value=reVal;}"" cursor:hand "">이미지를 수정하려면 여기를 클릭하세요
'changephoto.htm'이라는 단어 창에서 프레임세트를 엽니다. 프레임세트에는 ASP 파일이 포함되어 있습니다. 먼저 ASP 값을 Changephoto.htm에 반환한 다음 이 값을 기본 페이지에 반환합니다.
changephoto.htm:
function onClose() { window.returnValue = form1.save.value;//window.returnValue를 window.dialogArguments.oblogform.blogimage.value window.close()로 변경할 수도 있습니다. }
asp 파일: parent.document.form1.save.value="값 또는 변수";