とある技術者の備忘録的情報

Javascript – サブウィンドウからwindow.openerを使って親ウィンドウを操作する

window.openで開いたサブウィンドウから親ウィンドウへフォームの値をセットする。

サブウィンドウから親ウィンドウを操作するにはwindow.openerプロパティを利用する。

◆親ウィンドウ側

<!DOCTYPE HTML>
<html>
<head>
<title>親ウィンドウ | window.openerプロパティテスト</title>
</head>

<body>

<input type="button" value="サブウィンドウを開く" onClick="window.open('sub.html','sub','width=600,height=500'); return false;">

<form action="test.cgi" method="post" name="form1">
○好きな車
<input type="text" name="input01" value="">
</form>

</body>
</html>

◆サブウィンドウ側(sub.html)

<!DOCTYPE HTML>
<html>
<head>
<title>サブウィンドウ | window.openerプロパティテスト</title>
<script type="text/javascript">
<!―
function func_submit(test_val){
  if (!window.opener || window.opener.closed) {
    alert('親ウィンドウが存在しないか閉じられています');
    window.close();
  } else {
    var fm = window.opener.document.form1;	//親ウィンドウの「form1」ドキュメントを「fm」変数に代入
    fm.input01.value = test_val;	//親ウィンドウの「input01」ドキュメント(nameが「input01」のinputタグへ値を代入
    fm.submit();		//親ウィンドウのフォームを送信
    window.close();
    return false;
  }
}
// ―>
</head>

<body>

好きな車を選んでください。
<ul>
  <li><a href="javascript:;" onClick="return func_submit('フェラーリ');">フェラーリ</a></li>
  <li><a href="javascript:;" onClick="return func_submit('ポルシェ');">ポルシェ</a></li>
  <li><a href="javascript:;" onClick="return func_submit('ランボルギーニ');">ランボルギーニ</a></li>
  <li><a href="javascript:;" onClick="return func_submit('アストンマーチン');">アストンマーチン</a></li>
  <li><a href="javascript:;" onClick="return func_submit('マセラティ');">マセラティ</a></li>
</ul>

<input type="button" value="閉じる" onClick="window.close(); return false;">

</body>
</html>

関連記事

コメント

  1. Wonderful beat ! I would like to apprentice whilst you
    amend your site, how could i subscribe for a blog web site?
    The account aided me a applicable deal. I were a little bit acquainted of this your broadcast provided brilliant transparent concept

  1. この記事へのトラックバックはありません。

スポンサードリンク