访问iframe内容-代码在控制台中有效，但在页面加载时无效

Question

When I run my code in console it works fine, but when I load the page it gives me an error - TypeError: undefined is not an object (evaluating 'rowInfo.textContent') 当我在控制台中运行代码时，它工作正常，但是，当我加载页面时，它给我一个错误-TypeError：undefined不是一个对象（评估'rowInfo.textContent'）

I have two webpages one that is the parent and the other that is the child. 我有两个网页，一个是父页面，另一个是子页面。 They are both on the same local server using the same protocol and port. 它们都在使用相同协议和端口的同一本地服务器上。 I have a third file that holds the javascript. 我有保存javascript的第三个文件。 Here is the relevant code: 以下是相关代码：

Parent Page 父页面

<html>
    <head>
        <title>Broker's Lead List</title>

        <link rel="stylesheet" type="text/css" href="style.css"/>
        <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
        <script type="text/javascript" src="https://c1eru548.caspio.com/scripts/embed.js"></script>
    </head>
    <body>
        <div id="callback"></div>

        <script type="text/javascript" src="scripts.js"></script>
        <script type="text/javascript">
            autoRefresh_div();
            window.frames['DueDateCounter'].addEventListener("load", alert("loaded"));
            popUpWindow();
    </body>
</html>

Javascript code JavaScript代码

function autoRefresh_div() {
    $("#callback").empty()
                  .html('<iframe name="DueDateCounter" title="DueDateCounter" ' + 
                             'style="width: 1px; height: 1px" ' + 
                             'src="https://192.168.0.50/CRM/CalanderCountDown.html">Sorry, but// your browser does not support frames.//</iframe>'); 
}

var f, doc, rowInfo, minutesUntilCallBack, calenderItem, calenderItemId;

function popUpWindow() {
    f = $('iframe')[0];

    doc = f.contentDocument? f.contentDocument: f.contentWindow.document;
    rowInfo = doc.getElementsByTagName('td')[0];
    minutesUntilCallBack = rowInfo.textContent;

    calendarItem = f.contentDocument.getElementsByTagName('td')[1];
    calendarItemId = calendarItem.textContent;

    alert(minutesUntilCallBack);
    alert(calendarItemId);
}

After the page has loaded and I go to the console, I can see that the variable f is defined, but nothing else is defined. 页面加载完毕并转到控制台后，可以看到已定义变量f ，但未定义其他任何内容。 Now if I use the console and put the code in everything works fine. 现在，如果我使用控制台并将代码放入所有程序中，一切正常。 The minutesUntilCallBack alerts and so does the correct calendarItemId . minutesUntilCallBack发出警报，正确的calendarItemId minutesUntilCallBack发出警报。

I thought it might have been a problem with the iframe not being loaded properly, so I put a listening event in, that I have to OK before I run the function popUpWindow() that looks into the iframe . 我以为iframe加载不正确可能是个问题，所以我加入了一个监听事件，在运行运行到iframe的函数popUpWindow()之前必须确定。

I've read lots of posts about similar issues across many sites, but can't seem to get to the correct answer. 我在许多网站上都读过很多有关类似问题的文章，但似乎找不到正确的答案。

Any help much appreciated. 任何帮助，不胜感激。

Answer 1

You need to put the popUpWindow() function inside of the onload event listener for the iframe. 您需要将popUpWindow()函数放在iframe的onload事件监听器中。 It is currently running before the iframe has loaded. 当前正在iframe加载之前运行。 addEventListener is asynchronous. addEventListener是异步的。

window.frames['DueDateCounter'].addEventListener("load", function() { popUpWindow(); });

访问iframe内容-代码在控制台中有效，但在页面加载时无效

问题描述

1 个解决方案

解决方案1
0 已采纳 2016-01-11 15:55:31

访问iframe内容-代码在控制台中有效，但在页面加载时无效

问题描述

1 个解决方案

解决方案1 0 已采纳 2016-01-11 15:55:31

解决方案1
0 已采纳 2016-01-11 15:55:31