ShowModalDialog; Открывает новое окно в IE
Пожалуйста, смотрите обновление (11/27) ниже
У меня есть модальное окно, которое запускается с его содержимым в iframe (ASP веб-приложение). Нам нужно иметь модальное перенаправление на другую страницу, но оно не может быть в пределах iframe по соображениям безопасности (страница обработки Paypal). В режиме стандартов Chrome и IE у нас есть код, который корректно меняет модальный URL на правильный. Однако в режиме совместимости при перенаправлении открывается новое модальное окно с правильным URL-адресом. Как мы можем остановить его от открытия нового окна и фактического перенаправления?
Это наш текущий код:
dialog.redirect = function (location, ignoreFrames) {
/// <summary>Redirects the dialog to a new URL</summary>
/// <param name="location" type="String"></param>
/// <param name="ignoreFrames" type="Boolean">If true, the dialog's URL will be changed instead of any parent frame URLs</param>
if (ignoreFrames === undefined) {
ignoreFrames = true;
}
if (ignoreFrames === true) {
if (window.top) {
//Chrome and IE9+
window.top.document.location.replace(location);
} else {
//This was a supposed fix but it did not change the outcome
//<IE8 and compat mode
var redirectLink = document.createElement("a");
redirectLink.href = location;
document.body.appendChild(redirectLink);
redirectLink.click();
}
} else {
window.document.location.replace(location);
}
};
Обновление 11/27, с примером проблемы:
Интерактивный пример (требуется IE10+ или любой хороший браузер)
Ниже приведен пример проблемы, все настроено так, как у нас есть. Когда модальное устройство находится в режиме совместимости с IE, оно открывает новое окно вместо перенаправления модального. Перевод страницы в режим совместимости - непростой процесс, поскольку наше приложение использует режим совместимости, а внешняя модальная страница широко используется повсеместно. Просматривая страницу (main.html) в FireFox (проблема безопасности домена возникает в Chrome), она работает как положено; модал полностью перенаправлен на новую страницу.
main.html
<html>
<head></head>
<body>
<a href="javascript:window.showModalDialog('modal.html', self, 'status:no;resizable:yes;help:no;scroll:no;width:1000;height:600')">Open Modal</a>
</body>
</html>
modal.html
<!--[if lt IE 7]> <html class="lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class=""> <!--<![endif]-->
<head>
<title id="tagTitle"></title>
</head>
<body style="margin:0px">
<form name="Form1" method="post" action="" id="Form1">
<strong>modal.html</strong><br />
<iframe frameborder="1" src="frame.html" scrolling="yes"></iframe>
</form>
</body>
</html>
frame.html
<!DOCTYPE html>
<!--[if lt IE 7 ]> <html class="ie6" xmlns="http://www.w3.org/1999/xhtml"> <![endif]-->
<!--[if IE 7 ]> <html class="ie7" xmlns="http://www.w3.org/1999/xhtml"> <![endif]-->
<!--[if IE 8 ]> <html class="ie8" xmlns="http://www.w3.org/1999/xhtml"> <![endif]-->
<!--[if IE 9 ]> <html class="ie9" xmlns="http://www.w3.org/1999/xhtml"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->
<html class="" xmlns="http://www.w3.org/1999/xhtml">
<!--<![endif]-->
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
</head>
<body>
<strong>frame.html</strong><br />
<a href="javascript:void(0)" onclick="redirectToCart();" title="My Cart">Trigger Redirect</a>
<script type="text/javascript">
var redirect = function (location, ignoreFrames) {
/// <summary>Redirects the dialog to a new URL</summary>
/// <param name="location" type="String"></param>
/// <param name="ignoreFrames" type="Boolean">If true, the dialog's URL will be changed instead of any parent frame URLs</param>
if (ignoreFrames === undefined) {
ignoreFrames = true;
}
if (ignoreFrames === true) {
window.top.document.location.replace(location); //IE will create a new window at this point, instead of changing the modal's URL
} else {
window.document.location.replace(location);
}
};
function redirectToCart() {
redirect('anotherpage.html', true); //Change this to false to see just the inner frame's URL change
}
</script>
</body>
</html>
anotherpage.html
<html>
<head>
</head>
<body>
<strong>anotherpage.html</strong><br />
Success
</body>
</html>
1 ответ
Ваша проблема возникает потому, что вы используете showModalDialog который вводит это поведение при использовании IE,
Вы можете прочитать об этом здесь:
showModalDialog Открывает новое окно
Если вы хотите продолжить использовать showModalDialog вот работа вокруг:
modal.html
<head>
<base target="_self" />
...
</head>
<body style="margin:0px">
....
<a href="anotherpage.html" id="go" style="display:none;"></a>
</form>
</body>
frame.html
function redirectToCart() {
window.parent.document.getElementById('go').click();
}
пример