[문제와 해결] showModalDialog is not defined 솔루션

3476 단어
배경:
ModalDialog는 오래된 방법입니다. 일부 브라우저들은 팝업 모드 창을 지원하지 않습니다.
예를 들어 구글 조회는 더 이상 지원되지 않는다. 다음과 같은 글이 있다.
Chrome’s Lack of Support for showModalDialog Breaks Some Enterprise Web Apps
 
팝업 창 코드:
var obj = new Object();  
var retval = window.showModalDialog("request.aspx",obj,"dialogWidth=500px;dialogHeight=300px"); 
if (retval == null) {
...
}else {
...
}

브라우저 오류:
Uncaught TypeError: undefined is not a function

그중에 몇 가지 임시적인 해결 방법이 있지만 showModalDialog는 돌아오지 않을 것 같다.
 
문제 해결
흔히 볼 수 있는 팝업 창에는div 시뮬레이션이나 window가 있습니다.open 대체, 이미 사용되고 있는 시스템에 대해div 방식으로 전환하는 비용이 비교적 높고 window를 사용합니다.오픈 변경은 더 적지만 모드성을 잃어버릴 수도 있습니다.
여기는 간단한 window를 사용합니다.오픈 방안은 교체 원가가 매우 낮기 때문이다.위에서 언급한 showModalDialog 사용 방법에 대해 다음과 같이 바꿉니다.
var iWidth = 500; 
var iHeight = 300; 
var iTop = (window.screen.availHeight - 30 - iHeight) / 2; 
var iLeft = (window.screen.availWidth - 10 - iWidth) / 2; 
var win = window.open("request.aspx", "    ", "width=" + iWidth + ", height=" + iHeight + ",top=" + iTop + ",left=" + iLeft + ",toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no,alwaysRaised=yes,depended=yes");

 
매개변수 설명
dialogWidth:     。 
dialogLeft:        。 
dialogTop:       。 
center:{yes|no|1|0}:      ,  yes,           。 
help:{yes|no|1|0}:        ,  yes。 
resizable:{yes|no|1|0}[IE5+]:        。  no。 
status:{yes|no|1|0}[IE5+]:       。   yes[Modeless] no[Modal]。 
scroll:{yes|no|1|0|on|off}:            。   yes。          HTA  ,            。 
dialogHide:{yes|no|1|0|on|off}: 。 no。 edge:{sunken|raised}: 。 raised。 unadorned:{yes|no|1|0|on|off}: no。

 
이런 방식을 사용하면 이전에 showModalDialog를 사용했던 것과 차이가 많지 않은 창을 열 수 있다.그런데 값을 어떻게 되돌려줍니까?
팝업 페이지에는 다음 두 가지 방법이 있습니다.
1. 부모 창의 DOM 객체 값을 직접 설정합니다.
window.opener.document.getElementById(“parentWindowControlId”).value = "  ";

부모 창에 id가parentWindowControllId인 DOM 요소가 있어야 합니다.
 
2. 부모 창의 자바스크립트 함수를 호출하고 부모 창에서 해당하는 처리를 한다.
var obj = { id:"id", name:"name" };  window.opener.DoAfterXXX(obj);

부모 창에서 DoAfterXXX 함수를 제공하면 됩니다.
 
장기적으로 윈도우.오픈은 사용자 체험 문제로 인해 반드시 몰락할 것이니 가능한 한 빨리 옮기는 것이 좋다.
 
전재 대상:https://www.cnblogs.com/yc-755909659/p/9641868.html

좋은 웹페이지 즐겨찾기