モーダルダイアログの表示

モーダルダイアログを表示するにはwindow.showModalDialogメソッドを使用します。
モーダルダイアログの特徴は、呼び出し元がアクティブになることはありません。また表示サイズなどを第三引数で指定することが出来ます。

第一引数にはファイルパス、ファイル名を指定します。
第二引数にはwindowを指定します。
第三引数にはモーダルの表示サイズなどの設定を指定します。

モーダルからの戻り値は、window.returnValueにセットします。すると呼び出し元にその値が渡されます。
以下のボタンを押すとモーダルダイアログが表示されます。表示されたモーダルのどちらかのCLOSEボタンを押すと戻り値が表示されます。




ソース
<html>
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
function a(){
    var a = window.showModalDialog("./a.html",window,"");
    alert("戻り値 = " + a);
}
</script>
<input type="button" value="button" name="submit" onClick="a()">
</body>
</html>
モーダルダイアログのソース
<html>
<head>
<title></title>
</head>
<script type="text/javascript">
function a(){
    window.returnValue="1";
    window.close();
}
function b(){
    window.returnValue="2";
    window.close();
}
</script>
<body>
    <input type="button" value="CLOSE1" name="submit" onClick="a()">
    <input type="button" value="CLOSE2" name="submit" onClick="b()">
</body>
</html>

初版2008/02/15 :最終更新2008/02/15
HOME