JavaScriptウィンドウ間の値転送-モダリティとモダリティウィンドウ間の値転送

2837 ワード

JavaScript html XHTML

モードと非モーダルウィンドウの間の値の転送
モダリティダイアログとは、有効なクローズ手段がない限り、ユーザのマウスフォーカスまたは入力カーソルがその上に留まり続けるダイアログのことです.このような特性を強制することなく、現在のダイアログと他のウィンドウとの間でユーザーが切り替えられます.

親ウィンドウコード

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>     </title>
<script language="javascript">
	var win;
	//       
	function open_modalDialog() {		
		window.showModalDialog("son.html", window, "dialogHeight:300px, dialogWidth:150px");			
	}
	//        
	function open_modalessDialog() {
		//            
		win = window.showModelessDialog("son.html", window, "dialogHeight:300px, dialogWidth:150px");		
	}
	
	//           
	function test_child() {
		var age = win.document.getElementsByName("age")[0];
		age.value = 20;
		alert(age.value);
	}
	
	//           ，                ，       
</script>

</head>
<body>
	   ：<input type="text" name="username" /><br />
    <input type="button" value="      " onclick="open_modalDialog()" /><br />
    <input type="button" value="       " onclick="open_modalessDialog()" /><br />
    <input type="button" value="      " onclick="test_child()" /><br />
</body>
</html>

サブウィンドウコード

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>     </title>
<script language="javascript">
	//          (  )
	function test_parent() {
		//         
		var parentwin = window.dialogArguments;
		var username = parentwin.document.getElementsByName("username")[0];
		username.value = "keveon";
		alert(username.value);		
	}		
</script>
</head>
<body>
	  ：<input type="text" name="age" /><br />    
    <input type="button" value="      " onclick="test_parent()" />    
</body>
</html>

JavaScript類の継承操作例のまとめ