谷歌浏览器在 JavaScript 动态更改后未更新 iframe 元素 innerHTML

Posted

技术标签:

【中文标题】谷歌浏览器在 JavaScript 动态更改后未更新 iframe 元素 innerHTML【英文标题】:Google Chrome not updating iframe element innerHTML after dynamically changes in JavaScript 【发布时间】:2013-04-07 10:12:15 【问题描述】:

我有一个很大的页面,其中包含 Iframe 和 javascript 函数来使用它。 我将简化我的代码,例如:

Simple html:
<html>
<head>
    head tags
</head>
<body>
    <iframe id="iframe_1" align="center" src="iframe-test.html"></iframe>
</body>
</html>

iframe-test.html 的内容:

<html>
<head>
</head>
<body>
    <span id="my_element">50</span>
</body>
</html>

我的 JavaScript 函数:

function test()
var my_element = document.getElementById("iframe_1").contentWindow.document.getElementById("my_element");
my_element.innerHTML = "60";

所以。它在 IE 和 FF 中完美运行,但 Chrome 不会更新 my_element 的 innerHTML,直到我用鼠标选择它!是的,没错。我正在调用 js 函数,但在 Chrome 中没有看到更新,在我用鼠标光标选择“50”后,它会用新值“60”刷新。我该如何解决?

【问题讨论】:

【参考方案1】:

当我在自己的机器上尝试过它时,它谈到了 3 个错误:

1.Uncaught TypeError: Cannot set property 'innerHTML' of null test.html:12
2.Unsafe JavaScript attempt to access frame with URL file:///C:/Users/sadaf2605/Downloads/New%20folder/iframe-test.html from frame with URL file:///C:/Users/sadaf2605/Downloads/New%20folder/test.html. Domains, protocols and ports must match.
3. Uncaught TypeError: Cannot call method 'getElementById' of undefined 

正如数字 2 所说:Domains, protocols and ports must match. 所以我认为当你将它上传到服务器时,这个错误不应该发生,因为域、协议和端口在真实服务器中将是相同的。

【讨论】:

以上是关于谷歌浏览器在 JavaScript 动态更改后未更新 iframe 元素 innerHTML的主要内容,如果未能解决你的问题,请参考以下文章

GatsbyJS 在初始加载后未加载谷歌字体

更改模型后未正确绘制 QML 中继器

在 Usemap/area 情况下,光标未更改为指针

插入 API 密钥后未加载 Android 谷歌地图

如何修复谷歌不可见 reCAPTCHA 验证后未提交的 Ajax 表单

更改语言环境后未调用 onConfigurationChange