1

こんにちは、私の投稿を読んでいただきありがとうございます。

これが私が基本的にやりたいことです:

  • 最初の HTML ページ (「parent.html」) には、ボタンがあります。

  • ユーザーがボタンをクリックすると、新しいウィンドウがポップアップします ("child.html")

  • AND 子ウィンドウの「div」要素の内容が更新されます。

「Firefox」および「Chrome」では、最終アクションが失敗します。

親.html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Parent window document</title>
  </head>
  <body>
    <input 
     type="button" 
     value="Open child window document" 
     onclick="openChildWindow()" />

    <script type="text/javascript">
    function openChildWindow()
    {
      var s_url     = "http://localhost:8080/projectroot/child.html";
      var s_name    = "ChildWindowDocument";
      var s_specs   = "resizable=yes,scrollbars=yes,toolbar=0,status=0";
      var childWnd  = window.open(s_url, s_name, s_specs);
      var div       = childWnd.document.getElementById("child_wnd_doc_div_id");
      div.innerHTML = "Hello from parent wnd";
    }
    </script>
  </body>
</html>

child.html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Parent window document</title>
  </head>
  <body>
    <div id="child_wnd_doc_div_id">child window</div>
  </body>
</html>
  • IE9 => 動作します。

  • Firefox 13.0.1 => 動作しません。エラー メッセージ:「div が null です」。

  • Chrome 20.0.1132.47 m => 動作しません。

あなたはその行動を理解していますか?

これら3つのケースで機能させるのを手伝ってもらえますか?

ありがとうございます。よろしくお願いします。

4

1 に答える 1

1

ウィンドウ/ドキュメントから要素にアクセスしようとすると、ウィンドウ/ドキュメントが読み込まれていないと思います。次のようなことができます

childWnd.onload = function() {
    var div       = childWnd.document.getElementById("child_wnd_doc_div_id");
    div.innerHTML = "Hello from parent wnd";
}

また、mdn docもご覧ください。


問題へのより良いアプローチは、「子」で変更を行うことです。で親ウィンドウにアクセスできますwindow.opener。ただし、親ウィンドウが閉じられる可能性があるため、何らかの種類のローカル ストレージ (Cookie など) を検討する必要があることに注意してください。

于 2012-07-09T15:09:04.373 に答える