如何從子窗口訪問父級中的div

Question

我的父窗口中有一個div，我想在其中顯示已添加到數據庫中的新輸入記錄。

這是在父窗口內：

<div id="divTable"></div>

此按鈕在子窗口內：

<input type="button" name="submit" value="Submit" onclick="updateTable();"/>

這是在我的外部javascript文件中：

function updateTable()
{
 if(insertThis()==true)
 {
  alert("Your details have been entered! Please click on 'View' to display all records.");
 }
 //What should I put here?
}//updateTable(w, h)

在同一個javascript文件中，我還有另一個函數，它僅使用ajax顯示表（在父窗口中顯示另一個按鈕）：

function displayTable()
{
 var page = "database.php"
 var parameters = 'action=update';
 var xmlhttp = new XMLHttpRequest();

  if(xmlhttp==null)
  {
   alert("Your browser does not support AJAX!");
   return false;
  } 
  xmlhttp.onreadystatechange=function()
  {      
   document.getElementById("divTable").innerHTML=xmlhttp.responseText;
  };
  xmlhttp.open("GET", page+"?"+parameters, true);
  xmlhttp.send(null); 
}//displayTable()

我還有另一個PHP文件，但它只處理將查詢插入數據庫中的問題。

在子窗口中，我有文本字段和單選按鈕等，可根據需要輸入數據庫。

那么我應該在updateTable()函數中放什么呢？ 我應該把displayTable()函數放在那里嗎？ 我試過了widnows.opener ，它似乎不起作用。 我在網上研究了其他示例，但它們沒有處理外部javascript文件，因此我有點困惑（或者與我不太確定也沒有關系）。

我希望得到的結果是，在用戶輸入了所需的內容並單擊“ Submit按鈕之后，我希望表立即顯示在父窗口中。 目前，我正在使用父窗口中的另一個按鈕來顯示表格。 我要這樣做是因為，如果用戶先查看表然后輸入新數據，則在用戶退出后，用戶必須單擊按鈕才能再次查看表。 （表格將顯示在div ）任何解決方案？

注意：在我的displayTable()函數中，我有document.getElementById("divTable").innerHTML=xmlhttp.responseText; 所以我不確定是否應該重用此功能。

PS我喜歡原始的javascript解決方案，因為它是我的新手，並且仍在學習中，因此我還沒有涉及jQuery。

Answer 1

您可以嘗試通過運行displayTable();來重建表displayTable(); 再次起作用：

    function updateTable()
    {
     if(insertThis()==true)
     {
      alert("Your details have been entered! Please click on 'View' to display all records.");
      //Indeed you'd better put it here:
      window.opener.displayTable();
     }
     //What should I put here?

    }//updateTable(w, h)

另一個建議是：在父頁面上，如下更改body標簽：

 <body onload="displayTable()">

然后在子頁面的腳本中重新加載該頁面：

function updateTable()
        {
         if(insertThis()==true)
         {
          alert("Your details have been entered! Please click on 'View' to display all records.");
          //Indeed you'd better put it here:
          //window.opener.displayTable();
          window.opener.location.reload();
         }
         //What should I put here?

        }//updateTable(w, h)

Answer 2

您不能在外部javascript中訪問任何結果文檔並具有硬編碼引用的內容。 在加載javascript時，對文檔一無所知，只有在文檔准備就緒時才知道。

如果已加載的javascript中有任何內容，則在文檔完全加載后，您需要移交結果/完成的對象。

因此，如果有一個對表有作用的函數，您將其稱為

updateTable(opener.document.getElementById('divTable'));

在函數內部，您使用變量來引用THAT對象。 但是無論如何，這應該在文檔加載后起作用

window.onload=function(){
    opener.document.getElementById('divTable').style.visibility ="hidden";
    opener.document.getElementById('divTable').innerHTML='Hello, World';
    opener.document.getElementById('divTable').style.visibility ="visible";
}

這在<script>標記的加載子窗口的最終html文檔中。

如何從子窗口訪問父級中的div

問題描述

2 個解決方案

解決方案1
2 已采納 2015-05-18 05:36:28

解決方案2
0 2015-05-18 05:48:57

如何從子窗口訪問父級中的div

問題描述

2 個解決方案

解決方案1 2 已采納 2015-05-18 05:36:28

解決方案2 0 2015-05-18 05:48:57

解決方案1
2 已采納 2015-05-18 05:36:28

解決方案2
0 2015-05-18 05:48:57