为什么 html 框架在 Firefox 和 IE8 中的行为不同?

发布于 2024-08-31 16:04:24 字数 4600 浏览 3 评论 0原文

我在我的网站上使用html框架,它已经运行了一段时间了,通常我只使用Firefox上网,我的网站看起来和功能都很好,但是今天我突然发现IE8在我的网站上的框架有问题,如果我单击顶部菜单项,它应该在框架的下部显示内容,在 Firefox 中正确执行此操作,但在 IE8 中,它在框架的上部显示内容并替换菜单项。

为了提供更多细节,我将包括我的 html 页面的简化版本,在顶层有两个项目,一个 index.html 页面和一个文件目录,除 index.html 之外的所有页面都在该目录中,所以它看起来像这样:

index.html
Dir_Docs
  00_Home.html
  00_Install_Java.html
  00_Top_Menu.html
  01_Home_Menu.html
  01_Install_Java_Menu.html
  10_Home_Welcome.html
  10_How_To_Install_Java.html

[ index.html ]
<Html>
  <Head><Title>Java Applications : Tv_Panel, Java_Sound, Biz Manager and Web Academy</Title></Head>

<Frameset Rows="36,*" Border=5 Bordercolor=#006B9F>
  <Frame Src=Dir_Docs/00_Top_Menu.html Frameborder=YES Scrolling=no Marginheight=1 Marginwidth=1>
  <Frame Src=Dir_Docs/00_Home.html Name=lower_frame Marginheight=1 Marginwidth=1>
</Frameset>
</Html>

[ 00_Home.html ]
<Html>
  <Head><Title>NMJava Application Development</Title></Head>

  <Frameset Cols="217,*" Align=center BorderColor="#006B9F">
    <Frame Src=01_Home_Menu.html Frameborder=YES Name=side_menu Marginheight=1 Marginwidth=1>
    <Frame Src=10_Home_Welcome.html Name=content Marginheight=1 Marginwidth=1>
  </Frameset>
</Html>

[ 00_Install_Java.html ]
<Html>
  <Head>
    <Title>Install Java</Title>
</Head>

  <Frameset Cols="217,*" Align=center BorderColor="#006B9F">
    <Frame Src=01_Install_Java_Menu.html Frameborder=YES Name=side_menu Marginheight=1 Marginwidth=1>
    <Frame Src=10_How_To_Install_Java.html Name=content Marginheight=1 Marginwidth=1>
  </Frameset>
</Html>

[ 00_Top_Menu.html ]
<Html>
  <Head>Top Menu</Head>
<Body>
<Center>

<Base target=lower_frame>

<Table Border=1 Cellpadding=3 Width=100%>
  <Tr>
    <Td Align=Center Bgcolor=#3366FF><A Href=00_Home.html><Font Size=4 Color=White>Home</Font></A></Td>
    <Td Align=Center Bgcolor=#3366FF><A Href=00_Install_Java.html><Font Size=4 Color=White>Install Java</Font></A></Td>
  </Tr>
</Table>

</Center>

</Body>
</Html>

[ 01_Home_Menu.html ]
<Html>
  <Head><Title>Home Menu</Title></Head>

<Base Target=content>
<Body Bgcolor=#7799DD>
  <Center>
    <Table Border=1 Width=100%>
      <Tr><Td Align=center Bgcolor=#66AAFF><A Href=10_Home_Welcome.html>Welcome</A></Td></Tr>
    </Table>
  </Center>
</Body>

</Html>

[ 01_Install_Java_Menu.html ]
<Html>
  <Head><Title>Install Java</Title></Head>

<Base Target=content>
<Body Bgcolor=#7799DD>
  <Center>
    <Table Border=1 Width=100%>
      <Tr><Td Align=Center Bgcolor=#66AAFF><A Href=10_How_To_Install_Java.html>How To Install Java ?</A></Td></Tr>
    </Table>
  </Center>
</Body>

</Html>

[ 10_Home_Welcome.html ]
<Html>
  <Head><Title>NMJava For Software Development</Title></Head>
<Body>

<Center>
  <P>
  <Font Size=5 Color=blue>Welcome To NMJava For Software Development</Font>
  <P>

</Center>
</Body>
</Html>

[ 10_How_To_Install_Java.html ]
<Html>
  <Head>
    <Title>Install Java</Title>
  </Head>

  <Body>
    <Center>

    <Br>
    <Font Size=5 Color=#0022AE><A Href=http://java.com/en/download/index.jsp>How To Install Java ?</A></Font>
    <Br>
    <P>
    <Table Width=90% Cellspacing=5 Cellpadding=5>
      <Tr><Td><Font Color=#0022AE>
        You need JRE 6 (Java Runtime Environment) to run the programs on this site. You may or may not have Java already installed on your PC, you can find out by going to the following 
site, if you don't have the latest version, you can install/upgrade it, it's free from Sun/Oracle at :<Font Size=4> <A Href=http://java.com/en/download/index.jsp>http://java.com/en/download/index.jsp</A></Font>.<P>
      </Font></Td></Tr>
    </Table>
    </Center>

  </Body>
</Html>

它们有什么问题,为什么两个浏览器的行为不同,以及如何解决这个问题?

我的网站位于: http://nmjava.com ,以防您想查看更多详细信息。

坦率

I use html frame on my webiste, it's been running for I while, usually I only use Firefox to surf the net, my site looks and functions ok, but today I suddenly found IE8 has a problem with the frame on my site, if I click on the top menu items, it's supposed to display the content in the lower part of the frame, it does this correctly in Firefox, but in IE8, it displays the content in the upper part of the frame and replaces the menu items.

In order to give more details, I'll include a simplified version of my html pages, at the top level there are two items, an index.html page and a file directory, all the pages except the index.html are in the directory, so it looks like this :

index.html
Dir_Docs
  00_Home.html
  00_Install_Java.html
  00_Top_Menu.html
  01_Home_Menu.html
  01_Install_Java_Menu.html
  10_Home_Welcome.html
  10_How_To_Install_Java.html

[ index.html ]
<Html>
  <Head><Title>Java Applications : Tv_Panel, Java_Sound, Biz Manager and Web Academy</Title></Head>

<Frameset Rows="36,*" Border=5 Bordercolor=#006B9F>
  <Frame Src=Dir_Docs/00_Top_Menu.html Frameborder=YES Scrolling=no Marginheight=1 Marginwidth=1>
  <Frame Src=Dir_Docs/00_Home.html Name=lower_frame Marginheight=1 Marginwidth=1>
</Frameset>
</Html>

[ 00_Home.html ]
<Html>
  <Head><Title>NMJava Application Development</Title></Head>

  <Frameset Cols="217,*" Align=center BorderColor="#006B9F">
    <Frame Src=01_Home_Menu.html Frameborder=YES Name=side_menu Marginheight=1 Marginwidth=1>
    <Frame Src=10_Home_Welcome.html Name=content Marginheight=1 Marginwidth=1>
  </Frameset>
</Html>

[ 00_Install_Java.html ]
<Html>
  <Head>
    <Title>Install Java</Title>
</Head>

  <Frameset Cols="217,*" Align=center BorderColor="#006B9F">
    <Frame Src=01_Install_Java_Menu.html Frameborder=YES Name=side_menu Marginheight=1 Marginwidth=1>
    <Frame Src=10_How_To_Install_Java.html Name=content Marginheight=1 Marginwidth=1>
  </Frameset>
</Html>

[ 00_Top_Menu.html ]
<Html>
  <Head>Top Menu</Head>
<Body>
<Center>

<Base target=lower_frame>

<Table Border=1 Cellpadding=3 Width=100%>
  <Tr>
    <Td Align=Center Bgcolor=#3366FF><A Href=00_Home.html><Font Size=4 Color=White>Home</Font></A></Td>
    <Td Align=Center Bgcolor=#3366FF><A Href=00_Install_Java.html><Font Size=4 Color=White>Install Java</Font></A></Td>
  </Tr>
</Table>

</Center>

</Body>
</Html>

[ 01_Home_Menu.html ]
<Html>
  <Head><Title>Home Menu</Title></Head>

<Base Target=content>
<Body Bgcolor=#7799DD>
  <Center>
    <Table Border=1 Width=100%>
      <Tr><Td Align=center Bgcolor=#66AAFF><A Href=10_Home_Welcome.html>Welcome</A></Td></Tr>
    </Table>
  </Center>
</Body>

</Html>

[ 01_Install_Java_Menu.html ]
<Html>
  <Head><Title>Install Java</Title></Head>

<Base Target=content>
<Body Bgcolor=#7799DD>
  <Center>
    <Table Border=1 Width=100%>
      <Tr><Td Align=Center Bgcolor=#66AAFF><A Href=10_How_To_Install_Java.html>How To Install Java ?</A></Td></Tr>
    </Table>
  </Center>
</Body>

</Html>

[ 10_Home_Welcome.html ]
<Html>
  <Head><Title>NMJava For Software Development</Title></Head>
<Body>

<Center>
  <P>
  <Font Size=5 Color=blue>Welcome To NMJava For Software Development</Font>
  <P>

</Center>
</Body>
</Html>

[ 10_How_To_Install_Java.html ]
<Html>
  <Head>
    <Title>Install Java</Title>
  </Head>

  <Body>
    <Center>

    <Br>
    <Font Size=5 Color=#0022AE><A Href=http://java.com/en/download/index.jsp>How To Install Java ?</A></Font>
    <Br>
    <P>
    <Table Width=90% Cellspacing=5 Cellpadding=5>
      <Tr><Td><Font Color=#0022AE>
        You need JRE 6 (Java Runtime Environment) to run the programs on this site. You may or may not have Java already installed on your PC, you can find out by going to the following 
site, if you don't have the latest version, you can install/upgrade it, it's free from Sun/Oracle at :<Font Size=4> <A Href=http://java.com/en/download/index.jsp>http://java.com/en/download/index.jsp</A></Font>.<P>
      </Font></Td></Tr>
    </Table>
    </Center>

  </Body>
</Html>

What's wrong with them, why the two browsers behave differently, and how to fix this ?

My site is at : http://nmjava.com , in case you want to see more details.

Frank

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

酒解孤独 2024-09-07 16:04:24
<Body>
<Center>

<Base target=lower_frame>

这就是你的具体问题。 只能在 内部使用,不能作为 的一部分。以前版本的 IE 可以让你侥幸逃脱; IE8 没有。它忽略了错位的碱基,因此留下了针对当前帧的链接。

不过,您可能会遇到更多奇怪的问题,因为您的标记在许多非常基本的方面都是无效的,除了框架只是不可取之外。

<Body>
<Center>

<Base target=lower_frame>

That's your specific problem. <base> is only allowed inside <head>, not as part of <body>. Previous versions of IE let you get away with it; IE8 doesn't. It ignores the misplaced-base and so leaves links targeted at the current frame.

You are likely to have more odd problems, though, as your markup is invalid in a variety of really basic ways, beyond the frames being merely inadvisable.

留一抹残留的笑 2024-09-07 16:04:24

您的 HTML 无效,并且 IE 会因无效 html 而出错,从而导致奇怪的行为。老实说,弄清楚代码中发生了什么有点困难,因为它非常不标准。您应该熟悉 html 最佳实践 - 单独的列表是一个很好的资源 (http://www.alistapart.com/ )就像 w3 (w3.org) 一样,您可能会发现他们的验证器很有用 (validator.w3.org)。首先,html 标签中的任何属性都需要用引号引起来,并且 html 标签应全部小写。

另外,要定位另一个框架,您的锚标记应类似于

Your HTML isn't valid, and IE is known to trip up on invalid html, causing weird behaviors. And to be honest, it's a little hard to figure out whats going on in your code since it's so non-standard. You should familiarize yourself with html best practices - a list apart is a good resource (http://www.alistapart.com/) as is w3 (w3.org) and you may find their validator useful (validator.w3.org). To start with, any attributes in your html tags need to be in quotes, and html tags should be all lowercase.

Also, to target another frame, your anchor tag should look like <a href="myurl.html" target="_frameName" />

旧情勿念 2024-09-07 16:04:24

您可以通过 HEAD 中的此命令强制 IE8 表现得像 IE7 一样。

<meta http-equiv="X-UA-Compatible" content="IE=7" />

虽然这不能解释问题,但这通常是一个快速解决方案。

在 IE8 中,按 F-12 打开调试窗口。它可以帮助您找到 HTML 中的问题。查看您的页面处于哪种文档模式。如果处于“怪异模式”,您就有麻烦了。

Quoo 说的是真的,在不使用框架的情况下重新思考你的设计。

替代文本
(来源:moveable.com

You can force IE8 into behaving like IE7 with this in your HEAD.

<meta http-equiv="X-UA-Compatible" content="IE=7" />

While this does not explain the problem, it is often a quick fix.

In IE8, press F-12 for the debugging window. It can help you find the problem in your HTML. See which document mode your page is in. If it's in "quirks mode", you're in trouble.

What Quoo says is true, rethink your design without the use of frames.

alt text
(source: moveable.com)

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文