Iframe和浏览器的后退按钮出现问题 [英] Problems with an Iframe and the Browser's Back Button

查看：73 发布时间：2019/6/5 14:27:57 javascript

本文介绍了Iframe和浏览器的后退按钮出现问题的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

你好，

我在这个论坛上很新，因为我有以下问题，

该网站位于 http://new.vanara.com

----------- -------------------------------------------------- ---------------

--------------------------- -----------------

以下是该网站的工作原理：

您应该在翻转中按一个按钮区域为了在iframe上加载源

文件，这个Iframe实际上被隐藏起来作为Buffer。这个加载的iframe的

体通过innerHTML方法转移到一个图层

..

----- -------------------------------------------------- ---------------------

--------------------- -----------------------

这就是问题：

问题始于你按下浏览器的后退按钮，转移到图层的

文本会像iframe那样改变。

假设你唯一应该改变的文本按

后退按钮，是iframe上加载的那个（没关系），但不是

转移到图层的那个。

任何帮助或建议都会非常有用。

谢谢，

Javier。

Hello,
I''m very new in this forum and as I have the following problem,
the website is in http://new.vanara.com
----------------------------------------------------------------------------
--------------------------------------------
Here''s how the site works:
You should press a button in the rollover area in order to load a source
file on an Iframe, this Iframe is actually hidden working as a Buffer. The
body of this loaded Iframe is transfered to a layer via the innerHTML method
..

----------------------------------------------------------------------------
--------------------------------------------
Here''s the problem:
The problem starts when you press the back button of the browser and the
text transfered to the layer changes as the Iframe does.
It is supposed that the only text that will should change if you press the
back button, is the one loaded on the Iframe (that doesn''t matter), but not
the one transfered to the layer.

Any help or suggestion would be very helpful.
Thanks,
Javier.

推荐答案

Javier写道：

Javier wrote:

你好，
我在这个论坛上很新，因为我有以下问题，
该网站位于 http://new.vanara.com
------------ -------------------------------------------------- --------------
-------------------------------- ------------
以下是该网站的工作原理：
您应该在翻转区域按一个按钮，以便加载源文件在iframe中，这个Iframe实际上是隐藏的。这个加载的iframe的主体通过innerHTML方法转移到一层
..

----------------- -------------------------------------------------- ---------
------------------------------------- -------
这就是问题所在：
当您按下浏览器的后退按钮并且转移到图层的
文本随着Iframe更改时，问题就开始了。

转移究竟是什么意思？要追加新节点并将DOM插入到DOM树节点中？
DOM？如果是这样，那么这可以用测试页面验证

。我的预感是，动态更改的文档将替换历史记录和缓存中的原始文档。

假设您按下的唯一文本应该更改
后退按钮，是一个加载在iframe上的（没关系），但不是转移到图层的那个。

让我向您保证，如果您想在最近的浏览器中正确控制行为并且确切地说是
，那么您最好的机会是使用

验证的标记代码，验证的CSS代码和W3C DOM 2个属性和

方法。

在这里，我不确定你所寻找的是否可能。我在一个iframe动态更改的文档上有一个演示页面和

使用前进按钮加载动态更改的第二个文档

（不是原始的第二份文件）但该演示版不涉及第一份

文件被修改。

任何帮助或建议都会非常有用。
谢谢，
Javier。

Hello,
I''m very new in this forum and as I have the following problem,
the website is in http://new.vanara.com
----------------------------------------------------------------------------
--------------------------------------------
Here''s how the site works:
You should press a button in the rollover area in order to load a source
file on an Iframe, this Iframe is actually hidden working as a Buffer. The
body of this loaded Iframe is transfered to a layer via the innerHTML method
..

----------------------------------------------------------------------------
--------------------------------------------
Here''s the problem:
The problem starts when you press the back button of the browser and the
text transfered to the layer changes as the Iframe does.
"transfered" means what exactly? New nodes being appended and
DOM-inserted into the DOM tree nodes? If so, then this can be verified
with a test page. My hunch is that the dynamically altered document will
replace the original document in the history and cache.
It is supposed that the only text that will should change if you press the
back button, is the one loaded on the Iframe (that doesn''t matter), but not
the one transfered to the layer.

Let me assure you that if you want to control a behavior properly and
precisely in recent browsers, then your best chances are with using
validated markup code, validated CSS code and W3C DOM 2 attributes and
methods.
Here, I don''t know for sure if what you''re looking for is possible. I
have a demo page on a dynamically altered document in an iframe and
using the forward buttons loads the dynamically altered 2nd document
(not the original 2nd document) but that demo does not involve a 1st
document being modified.

Any help or suggestion would be very helpful.
Thanks,
Javier.

您的框架集使用无效属性，没有doctype声明。您的

嵌入式样式表有几个错误。

非零长度属性值必须有一个单位。

4.2处理解析错误的规则

必须为长度值指定一个单位
http://www.w3.org/TR/CSS2/syndata.html#parsing-errors

4.3.2长度

"长度值的格式（在此

规范中用< length>表示）是一个可选的符号字符（''''或'' - ''，带有''''是

默认值）后紧跟一个< number> （有或没有

小数点）后面紧跟一个单位标识符（例如，px，deg，

等）。在0长度之后，单位标识符是可选的。
http://www.w3.org/TR/CSS2/syndata.html#length-units

你用的是的JavaScript的的："你的href值中的伪协议：这是绑定

出错并导致问题。
http://jibbering.com/faq/#FAQ4_24

您的页面基于表格设计：那不是值得推荐，除非你使用表格数据来表示... ...在这里，情况并非如此。

您还有一个框架集层次结构：4 2个嵌套框架集内的框架。

你的

< frame src =" fill.htm"名称= QUOT; leftFrame"滚动= QUOT;否] noresize>

< frame src =" fill.htm"名称= QUOT; rightFrame"滚动= QUOT;否] noresize>

也是空文件...也许你还在建立你的网站..

然而..

我建议你不要使用这样的帧。如果它是您的最佳解决方案，您仍然可以使用iframe

来满足您的网页需求。

该文档永远不会在NS 7.1中加载，因为，很可能，这个

函数：

函数loadSourceFinish（id）{

document.all [id] .innerHTML = self.bufferFrame .document.body.innerHTML}

你的代码应该避免使用document.all（对于跨浏览器

目的）和innerHTML和eval（）还有很多其他原因，我不会在这里解释
解释。

加速页面渲染的一种方法是尽量减少/>
..js文件：在这里，我想知道为什么你不能将这5个外部的

脚本文件合并为1或2个文件。

您的样式表可以通过多种方式进行优化：

..content {

font-family：Verdana，Arial，Helvetica，sans-serif;

字体大小：9px;

颜色：＃666666;

font-weight：normal;

填充左：0;

行高：15px;

}

..内容

{

字体：普通9px / 15px Verdana，Arial，Helvetica，sans-serif;

颜色：＃666;

}

请注意，颜色是可继承的属性，而padding-left则不是。

因此，根据您的标记代码，它可能会甚至不需要

在这里声明填充左边和颜色。

等..

我想你应该首先处理你的页面设计（如果可能的话，应该总是避免使用很多帧

和帧），定义一个无表格的

设计，然后验证标记代码和CSS样式表。

DU

-

Javascript和浏览器错误：
http://www10.brinkster.com/doctorunclear/

- 资源，帮助和Netscape 7.x用户和作曲家的提示

- 国际米兰弹出窗口上的活动演示，Netscape 7.x中的音乐（音频/ midi）
http://www10.brinkster.com/doctorunc...e7Section.html

Your frameset uses invalid attributes, has no doctype declaration. Your
embedded stylesheet has several errors.
Non-zero length property value must have an unit.
4.2 Rules for handling parsing errors
"a unit must be specified for length values"
http://www.w3.org/TR/CSS2/syndata.html#parsing-errors
4.3.2 Lengths
"The format of a length value (denoted by <length> in this
specification) is an optional sign character (''+'' or ''-'', with ''+'' being
the default) immediately followed by a <number> (with or without a
decimal point) immediately followed by a unit identifier (e.g., px, deg,
etc.). After the ''0'' length, the unit identifier is optional."
http://www.w3.org/TR/CSS2/syndata.html#length-units

You use "javascript:" pseudo-protocol in your href values: this is bound
to go wrong and cause problems.
http://jibbering.com/faq/#FAQ4_24

Your page is based on table design: that''s not recommendable unless you
make use of tabular data... and here, it''s not the case.

You also have a frameset hierarchy: 4 frames within 2 nested framesets.
Your
<frame src="fill.htm" name="leftFrame" scrolling="NO" noresize>
<frame src="fill.htm" name="rightFrame" scrolling="NO" noresize>
are empty documents also... maybe you''re still building your website..
nevertheless..
I recommend you do not use frames like that. You may still use an iframe
for your webpage needs if it''s the best solution for you.

The document never gets loaded in NS 7.1 because, most likely, of this
function:
function loadSourceFinish(id){
document.all[id].innerHTML = self.bufferFrame.document.body.innerHTML }

Your code should avoid everywhere use of document.all (for cross-browser
purposes) and innerHTML and eval() calls for many other reasons I won''t
explain here.

One way to speed up rendering of your page is to minimize the number of
..js files: here, I wonder why you can not combine these 5 external
script files into 1 or 2 files.

Your style sheet could be optimized in many ways:

..content {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 9px;
color: #666666;
font-weight: normal;
padding-left:0;
line-height: 15px;
}

..content
{
font: normal 9px/15px Verdana,Arial,Helvetica,sans-serif;
color:#666;
}

Note that color is an inheritable property while padding-left is not.
So, depending on your markup code, it might not be even necessary to
declare padding-left and color here.

etc..

I think you should first deal with the design of your page (many frames
and frames should always be avoided if possible), define a tableless
design, then validating the markup code and CSS stylesheets.

DU
--
Javascript and Browser bugs:
http://www10.brinkster.com/doctorunclear/
- Resources, help and tips for Netscape 7.x users and Composer
- Interactive demos on Popup windows, music (audio/midi) in Netscape 7.x
http://www10.brinkster.com/doctorunc...e7Section.html

Javier写道：

Javier wrote:

你好，
我在这个论坛上很新，因为我有以下问题，
网站是 http://new.vanara.com
---------------- -------------------------------------------------- ----------
------------------------------------ --------
以下是网站的工作原理：
你应该在翻转区域按一个按钮，以便在iframe上加载源文件，这个实际上隐藏了iframe作为缓冲区。这个加载的iframe的主体通过innerHTML方法转移到一层
..

----------------- -------------------------------------------------- ---------
------------------------------------- -------
这就是问题所在：
当您按下浏览器的后退按钮并且转移到图层的
文本随着Iframe更改时，问题就开始了。

转移究竟是什么意思？要追加新节点并将DOM插入到DOM树节点中？
DOM？如果是这样，那么这可以用测试页面验证

。我的预感是，动态更改的文档将替换历史记录和缓存中的原始文档。

假设您按下的唯一文本应该更改
后退按钮，是一个加载在iframe上的（没关系），但不是转移到图层的那个。

让我向您保证，如果您想在最近的浏览器中正确控制行为并且确切地说是
，那么您最好的机会是使用

验证的标记代码，验证的CSS代码和W3C DOM 2个属性和

方法。

在这里，我不确定你所寻找的是否可能。我在一个iframe动态更改的文档上有一个演示页面和

使用前进按钮加载动态更改的第二个文档

（不是原始的第二份文件）但该演示版不涉及第一份

文件被修改。

任何帮助或建议都会非常有用。
谢谢，
Javier。

Hello,
I''m very new in this forum and as I have the following problem,
the website is in http://new.vanara.com
----------------------------------------------------------------------------
--------------------------------------------
Here''s how the site works:
You should press a button in the rollover area in order to load a source
file on an Iframe, this Iframe is actually hidden working as a Buffer. The
body of this loaded Iframe is transfered to a layer via the innerHTML method
..

----------------------------------------------------------------------------
--------------------------------------------
Here''s the problem:
The problem starts when you press the back button of the browser and the
text transfered to the layer changes as the Iframe does.
"transfered" means what exactly? New nodes being appended and
DOM-inserted into the DOM tree nodes? If so, then this can be verified
with a test page. My hunch is that the dynamically altered document will
replace the original document in the history and cache.
It is supposed that the only text that will should change if you press the
back button, is the one loaded on the Iframe (that doesn''t matter), but not
the one transfered to the layer.

Let me assure you that if you want to control a behavior properly and
precisely in recent browsers, then your best chances are with using
validated markup code, validated CSS code and W3C DOM 2 attributes and
methods.
Here, I don''t know for sure if what you''re looking for is possible. I
have a demo page on a dynamically altered document in an iframe and
using the forward buttons loads the dynamically altered 2nd document
(not the original 2nd document) but that demo does not involve a 1st
document being modified.

Any help or suggestion would be very helpful.
Thanks,
Javier.

DU< dr * ******@hotREMOVEmail.com>写道：

DU <dr*******@hotREMOVEmail.com> writes:

你的代码应该避免到处
.... innerHTML
....由于许多其他原因我不会在这里解释。

Your code should avoid everywhere .... innerHTML .... for many other reasons I won''t explain here.

虽然我支持尽可能多地使用标准方法，但我还没有找到一个好的参数来创建使用DOM节点而不是

实践中的innerHTML属性。也就是说，我不知道支持.appendChild但不支持.innerHTML的浏览器

。

你能用innerHTML扩展这个问题吗？

除此之外，我同意你的意见。

/ L

-

Lasse Reichstein Nielsen - lr*@hotpop.com

Art D''HTML：< URL：http：/ /www.infimum.dk/HTML/randomArtSplit.html>

''没有判断的信仰只会降低精神神圣。''

While I support using standard methods as much as possible, I have not
been able to find a good argument for using DOM node creation instead of
the innerHTML property in practice. That is, I don''t know of a browser
that supports .appendChild but not .innerHTML.

Can you expand on the problem with innerHTML?

Apart from that, I concur with your comments.
/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
Art D''HTML: <URL:http://www.infimum.dk/HTML/randomArtSplit.html>
''Faith without judgement merely degrades the spirit divine.''

这篇关于Iframe和浏览器的后退按钮出现问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文

Iframe和浏览器的后退按钮出现问题 [英] Problems with an Iframe and the Browser's Back Button

问题描述

推荐答案

相关文章

前端开发最新文章

热门教程

热门工具

登录关闭

Iframe和浏览器的后退按钮出现问题 [英] Problems with an Iframe and the Browser's Back Button

问题描述

推荐答案

相关文章

前端开发最新文章

热门教程

热门工具

登录 关闭

登录关闭