`
落地窗
  • 浏览: 435497 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

iframe中刷新切换页面的执行时间

阅读更多
在用iframe的时候,用一些场景,比如先将iframe中的页面切换之后,才能进行一些操作,这些操作是针对切换后页面的,这个时候就比较恶心了,因为iframe切换页面的时刻,是在当前页面中的所有js执行完之后,浏览器才根据新的地址location进行请求新切换的页面,所以导致出现错误。
示例:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script type="text/javascript">
function test()
{
	alert('11');
	i1.location="3.html";
	alert('22');
	alert('33');
}

</script>
</head>

<body>
<iframe id="i1" name="i1" src="2.html" height="400" width="400"  ></iframe>
<input type="button" value="切换" onclick="test()" />
</body>
</html>


上面js过程,等到弹出33之后,i1这个iframe才进行请求到3.html。

个人认为最好的做法,不是想一些奇形怪状的js,绕过去,因为即使绕过去了,也会存在浏览器兼容问题,所以最好是将刷新后的所有操作,写到新的页面中,也就是在新的页面onload后才进行一些处理,这样就比较安全了!
分享到:
评论

相关推荐

    iframe标签实现网页部分刷新

    在网页设计和开发中,`iframe`(Inline Frame)标签是一种强大的工具,它允许我们将一个网页嵌入到另一个网页中,实现部分内容的独立加载和刷新,从而提高用户体验。`iframe`广泛应用于网站后台、模块化内容展示、...

    关于iframe的用法

    **iframe(内联框架)是HTML中的一个非常重要的元素,用于在当前页面中嵌入另一个网页。它在网站设计和开发中起到了关键的作用,尤其是在处理多内容聚合、页面部分更新和加载外部资源等方面。** ### iframe的基本...

    iframe记录历史记录(onhashchange)

    在IT行业中,`iframe` 和 `onhashchange` 是两个重要的前端开发概念,它们与页面的历史记录管理和单页面应用(SPA)的实现密切相关。本文将深入探讨这两个话题,并结合提供的标签"源码"和"工具",分析如何利用它们来...

    基于iframe的js动态标签tab

    这种技术主要用于在单个页面上加载和切换多个独立的内容区域,而无需刷新整个页面。下面将详细介绍这个主题的各个方面。 首先,我们来理解一下涉及到的每个组件: 1. **JavaScript (JS)**:这是一种广泛使用的...

    关于jQuery EasyUI 中刷新Tab选项卡后一个页面变形的解决方法

    在使用jQuery EasyUI框架开发中,Tab选项卡组件是常用的一个组件,它允许用户在一个页面上通过选项卡切换不同的内容区域。但是在某些情况下,例如在实现选项卡内容的动态刷新时,可能会遇到页面布局变形的问题。 ...

    layui多iframe页面控制定时器运行的方法

    定时器在网页中的常见用途包括数据轮询、实时更新或者执行某些定期任务。然而,当有多个页面使用定时器时,特别是在iframe之间切换时,如果不加以控制,可能会导致不必要的资源消耗。为了应对这个问题,我们可以采用...

    jquery tabs iFrame.pdf

    在网页设计中,jQuery UI 的 tabs 组件是一个非常流行的交互元素,它允许用户在不同的内容区域之间切换,而无需刷新整个页面。这个组件通过将页面内容分隔成多个标签页,提高了用户体验,使得大量信息的展示更为有序...

    PHP无刷新技术

    PHP无刷新技术是一种提高网页交互体验的方法,它允许页面的部分内容在用户不进行完整页面刷新的情况下更新,从而提供更快的响应速度和更好的用户体验。在Web开发中,这种技术通常通过AJAX(Asynchronous JavaScript ...

    基于Vue实现tab栏切换内容不断实时刷新数据功能

    本篇文章将详细介绍如何使用Vue来实现Tab栏切换时内容不断实时刷新数据的功能。 首先,理解产品需求:有多个Tab(例如5个),每个Tab对应不同的Ajax请求,内容区域相同,数据需要每3秒刷新一次。当用户切换Tab时,...

    jquery tabs iFrame.docx

    在本文中,我们将深入探讨如何将jQuery与tabs和iframe结合使用,以便在页面的标签页内实现页面的无刷新跳转。首先,我们来看一下给定的代码片段,这是一个使用jQuery UI库创建的tabs组件的例子。 `; background: #...

    JS实现刷新父页面不弹出提示框的方法

    对于没有使用frame或iframe的简单页面(即A页面),可以在B页面中定义一个关闭函数,该函数执行以下步骤: 1. 调用`window.opener.location.reload()`刷新父页面。 2. 将`window.opener`设置为null,以切断对父窗口...

    iframe_example

    在这个名为"iframe_example"的项目中,我们将探讨如何利用JavaScript和`iframe`进行网页开发。 首先,我们需要按照项目描述中的步骤进行操作: 1. **克隆项目**:通过`git clone`命令,你可以从远程仓库获取到`...

    js利用iframe实现选项卡效果

    IFrame可以用来加载不同的HTML文档,从而实现内容的切换,这在选项卡设计中非常有用,因为它允许我们在不刷新整个页面的情况下显示不同的内容。 在上述代码中,我们看到了HTML结构的设置,包括一个包含四个链接的...

    iframe异步加载实现点击左边菜单加载右边内容实例讲解

    在本实例中,我们将讨论如何利用iframe实现异步加载,特别是在点击左侧菜单时动态改变右侧内容,而无需刷新整个页面。 首先,我们需要创建三个文件:一个主页面(例如Default.html),以及两个用于在iframe中加载的...

    启明星Flash焦点图片切换管理系统

    在启明星系统中,iframe被用来在门户网站的首页中插入焦点图片管理系统的页面,这样用户在访问首页时就可以看到实时更新的焦点图片,而无需刷新整个门户页面。 5. **Flash技术**: 虽然现在HTML5已经广泛取代了...

    点击按钮后 框架内载入不同网页内容特效.rar

    这种效果常见于单页面应用(SPA,Single-Page Application)或动态导航菜单中,能够提供流畅的用户体验,无需刷新整个页面即可切换内容。 首先,我们要理解JS(JavaScript)在其中的作用。JavaScript是一种广泛用于...

    浅谈Vue页面级缓存解决方案feb-alive (下)

    Vue Router 利用此API实现页面的无刷新切换。 `vue 虚拟DOM原理`: Vue 使用虚拟DOM作为内存中的数据结构,它能够高效地计算出最小的DOM更新,以减少对真实DOM的操作,提高性能。在组件切换时,如果组件被 `keep-...

    UrlRewriter 缓存问题及一系列的相关探索

    为了解决这个问题,开发者通常需要执行一系列操作:在新标签中打开iframe页面,使用CTRL+F5强制刷新,再切换回原标签页按F5刷新。这些步骤的目的是确保每个步骤中浏览器都使用了正确的刷新和缓存清除方法。 在实验...

    IE6 弹出Iframe层中的文本框“经常”无法获得输入焦点

    有趣的是,通过在Iframe内右键刷新或使用TAB键切换焦点,可以暂时解决这个问题。这表明问题可能与浏览器的渲染更新有关。 解决这个问题的关键在于,通过JavaScript手动调用文本框的`focus()`方法,使得所有文本框都...

    jQuery Fancybox 无刷新放大图片(LightBox灯箱插件).zip

    1. **无刷新放大**:Fancybox的核心特性之一就是可以在不刷新页面的情况下,将选定的图片以弹出窗口的形式显示出来,提供一个全屏或半屏的浏览环境,使图片看起来更加清晰、美观。 2. **多媒体支持**:除了图片,...

Global site tag (gtag.js) - Google Analytics