选项卡式 html 应用程序答案

【问题标题】：tabbed html application选项卡式 html 应用程序
【发布时间】：2009-04-15 03:38:45
【问题描述】：

我正在编写一个复杂的基于选项卡的 Web 应用程序，其中每个选项卡在没有交互的意义上彼此无关。因此，为了便于开发，我希望每个选项卡都是一个单独的 html 页面，可以单独查看，在后期我可以通过选项卡组装它们，或者可能是菜单或树所以一个或多个问题是：

但我喜欢 iframe 的地方在于它可以完全模块化，因此每个页面都不知道其他页面。

注意：我选择了解释得很好的答案，但我仍然不确定为什么不是 iframe 问题iframes vs ajax 可能会回答。

【问题讨论】：

【解决方案1】：

是的，所有主要的桌面浏览器都支持 iframe。许多移动浏览器也是如此，包括 iPhone 上的 IEMobile、Opera Mobile 和 Safari。我所知道的不支持 iframe 的唯一主流浏览器是黑莓浏览器。
大部分浏览器都支持object标签，但是各个浏览器的实现却极其不一致。
只有带有普通导航菜单的平面页面有什么问题？如果您一次只显示一个页面，并且唯一放置在 iframe 之外的界面元素是选项卡菜单，那么为什么不将选项卡集成到页面布局中并取消框架？

任何类型的框架都会破坏人们熟悉的浏览器行为，例如前进和后退导航按钮。他们完全禁止使用书签。在构建网站时，您应该尽量不要限制或指示访问者如何允许他们浏览您的网站。如果用户想打开一个新选项卡的链接，他们不应该没有导航菜单。如果他们将浏览器窗口设置为特定大小，则页面内容应填充该区域，而不是 iframe 尺寸指定的预定区域。

框架本质上对用户不友好，这毫不奇怪，使它们对搜索引擎不友好；这就是为什么很少有专业网站使用框架/iframe。如今，廉价宽带已经足够普及，重新加载几千字节的导航数据对整体用户体验没有影响。

【讨论】：

我同意，但是 a) 在每个页面中都有导航项目不会是 ajaxian，即打开标签而不重新加载页面 b) 正如我所说，我可能希望每个页面都是单独的，所以我可以对某些用户俱乐部几页多一些，显然这可以是导航项逻辑的一部分，但事情变得复杂
我已经开发了很多带有 AJAX 接口的 Web 应用程序，而且我从来不需要使用 iframe。在 iframe 中加载/重新加载页面并不是真正的 AJAX。使用 AJAX，您应该能够在不加载新页面的情况下更新已加载文档的界面。
根据您显示的内容，您可以使用实际的 AJAX (XmlHttpRequest) 从服务器拉取数据，使用 JavaScript 在客户端进行处理，然后将其显示在 Div 元素或动态创建的界面。
是的，我明白你的意思，但基本上我想要的是在选项卡中加载一个复杂的页面，现在如何使用 iframe 和使用导航项来完成？
我在标签内的复杂页面可以有更多的标签，我知道它可以用 javascript/ajax 来完成，但更简单的解决方案看起来像 iframes

【解决方案2】：

如果我是你，我会使用 jQuery UI Tabs 而不是我自己的解决方案。

【讨论】：

我将使用 jQuery UI 选项卡，但它们是否允许我使用 ajax 加载任何页面，我创建了一个带有两个 jquery 选项卡的页面，并且在每个选项卡中插入了相同的页面，它没有向我显示我认为这些标签中的标签以某种方式加载的页面并没有像 iframe 那样真正加载？
我从星期三开始就在网站上，所以很抱歉没有回复你。好吧，不，使用 ajax 加载的选项卡内容不会加载到 iframe 中，而是加载到 div 中。我认为你真的不想加载到 iframe 中，Calvin 的帖子中暴露了一些原因。

【解决方案3】：

看起来你的网站不是静态的，所以我不明白你为什么用纯 HTML 来做。

我会使用 ASP.NET 和 CustomUserControl 作为您的每个选项卡，它们的所有选项卡都将是真正独立的，您可以在应用程序的任何位置重复使用它们

【讨论】：

【解决方案4】：

对于每个选项卡中的单独页面，您也可以使用服务器包含。

【讨论】：

【解决方案5】：

回答前两个问题：

就不同的方法而言，这在很大程度上取决于您将要对选项卡做什么。如果每个选项卡上都有很多信息或需要一段时间才能加载，那么单独的 iFrame 可能是最好的。此外，如果您打算将代码作为独立页面重用，那么 iFrame 也是一个不错的选择。

【讨论】：