如何从子窗口访问父级中的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