JavaScriptで子Windowをオープンして、入力した内容を親Windowで受け取る

プログラミング

JavaScriptをあまり使った事がなかったので、
子windowを起動しようとしていきなりつまりましたw
基礎から勉強と思って、色々調べてみたら４つも方法がありました

・ポップアップウインドウ ( Popup Object )
・インラインフレーム
・モーダルダイアログ
・モードレスダイアログ

参考にさせて頂いたサイトはこちらのサイトです。
4種類の２次ウインドウ


今回は｢モーダルダイアログ｣という方法を使用しました。
実装方法はこんな感じです。

親画面

<html>
<script language="Javascript">
<!--
 function openSubWindow() {
  var rtn = window.showModalDialog("sub.html", "window","dialogHeight:400px; dialogWidth:400px;");
  document.test.text.value = rtn
 }
-->
</script>
 <body>
  <form name="test">
   <input type="button" value="子windowを起動" onclick="openSubWindow()">
   <input type="text" name="text" >
  </form>
 </body>
</html>

子画面

<html>

<script language="Javascript">
<!--
 function backValue() {
  window.returnValue=document.test.subtext.value;
  window.close();
}
-->
</script>

 <body>
  <form name="test">
   <input type="button" value="確定" onclick="backValue()">
   <input type="text" name="subtext" value="文字を入力">
  </form>
 </body>
</html>

 サンプル

触ってみるとJavaScriptはなかなかおもしろいです。
これからもちょくちょく遊んでいきたいと思います。