jsモーダルウィンドウ（モーダルダイアログボックスとノンモーダルダイアログボックス）の使い方入門_基礎知識

JavaScript はモーダル ダイアログ ボックスと非モード ダイアログ ボックスに分けられます。実際、この 2 つの違いは、ダイアログ ボックスを閉じる前にユーザーが同じページの他の場所で作業できるかどうかです。たとえば、[ファイルを開く] ダイアログ ボックスは典型的なモーダル ダイアログ ボックスです。このダイアログ ボックスでアクションを実行した場合にのみ、ダイアログ ボックスを開くプログラム上で他の操作を実行できます。これは、非モーダル ダイアログ ボックスでは必要ありません。 。

モーダルダイアログ: showModalDialog
モードレスダイアログ: showModelessDialog

vReturnValue = window.showModalDialog(sURL [, vArguments] [,sFunctions])
vReturnValue = window.showModelessDialog(sURL [, vArguments] [,sFunctions])

戻り値: vReturnValue、もちろん戻り値はダイアログ ボックスから返されます。 sURL: 必須、開きたいページ

vArguments--

オプションのパラメータ、タイプ: バリアント。パラメータをダイアログ ボックスに渡すために使用されます。渡されるパラメータのタイプは、配列などを含めて制限されません。ダイアログ ボックスは、window.dialogArguments を通じて渡されたパラメータを取得します。

特徴 --
オプションのパラメータ、タイプ: 文字列。ダイアログ ボックスの外観やその他の情報を記述するために使用され、次の 1 つ以上をセミコロン「;」で区切って使用できます。
1.dialogHeight: ダイアログ ボックスの高さ (100 ピクセル以上)。IE4 では、dialogHeight と DialogWidth のデフォルトの単位は em ですが、IE5 では、モーダル ダイアログ ボックスを定義するときに単位として px を使用します。 。
2.dialogWidth: ダイアログ ボックスの幅。
3.dialogLeft: 画面の左側からの距離。
4.dialogTop: 画面からの距離。
5.center: {yes | no | 1 | 0}: ウィンドウが中央にあるかどうか、デフォルトははいですが、高さと幅は指定できます。
6.help: {yes | no | 0}: ヘルプ ボタンを表示するかどうか。デフォルトは [はい] です。
7.resizable: {はい | いいえ | 0} [IE5+]: サイズを変更できるかどうか。デフォルトは「いいえ」です。
8.status: {はい | いいえ | 0} [IE5]: ステータスバーを表示するかどうか。デフォルトは、yes[Modal] または no[Modal] です。
9.scroll:{ はい | いいえ | 0 | オン | オフ }: ダイアログ ボックスにスクロール バーを表示するかどうかを示します。デフォルトは「はい」です。
以下の属性は HTA で使用され、通常の Web ページでは通常使用されません。
10.dialogHide:{ はい | いいえ | 0 | オフ }: 印刷中または印刷プレビュー中にダイアログ ボックスを非表示にするかどうか。デフォルトは「いいえ」です。
11.edge:{ 沈んだ | 盛り上がった }: ダイアログ ボックスの境界線のスタイルを指定します。デフォルトは引き上げられています。
12.unadorned:{ はい | いいえ | オン | オフ |

パラメータの受け渡し:

1. パラメータをダイアログ ボックスに渡すには、vArguments を介して渡されます。文字列型の場合、最大長は 4096 文字です。オブジェクトを渡すこともできます。例:

-------------------------------
親.htm

<script> 
var obj = new Object(); 
obj.name="51js"; 
window.showModalDialog("modal.htm",obj,"dialogWidth=200px;dialogHeight=100px"); 
</script>

modal.htm

<script> 
var obj = window.dialogArguments 
alert("您传递的参数为：" + obj.name) 
</script>

-------------------------------

2. window.returnValue を通じて、ダイアログ ボックスを開いたウィンドウに情報を返すことができます。もちろん、オブジェクトにすることもできます。例:
-------------------------------
親.htm

<script> 
str =window.showModalDialog("modal.htm",,"dialogWidth=200px;dialogHeight=100px"); 
alert(str); 
</script>

modal.htm

<script> 
window.returnValue="http://www.51js.com"; 
</script>

window.showModalDialog または window.showModelessDialog を使用してモーダル ウィンドウを開いた後、親ウィンドウとの対話の問題がいくつか発生します。

対話型操作の前提条件は、showModalDialog メソッドまたは showModelessDialog メソッドを呼び出すときに、次のような 2 番目のパラメーターがウィンドウに渡されることです。 window.showModelessDialog('filename.htm',window,'dialogWidth=200px;dialogHeight=250px;')
次に、親ウィンドウのデータとメソッドを取得します。これは通常、returnValue
を通じて子ウィンドウのパラメータを取得できます。