iframe引入嵌套页面中超链接全页刷新

最新推荐文章于 2023-09-22 09:28:23 发布
原创 最新推荐文章于 2023-09-22 09:28:23 发布 · 666 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文介绍如何在使用Bootstrap构建的页面中，通过修改超链接的target属性，使iframe内的菜单栏超链接能够实现全页面刷新，而非仅刷新菜单栏部分。

Bootstrap将页面分2部分，左边菜单栏
父页面通过iframe引入menu.html，实现菜单栏

<iframe align="center" width="100%" height="`400" src="/menu"  frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="yes`"></iframe>

菜单栏中超链接：

<li><a href="/test/">test</a></li>

问题：点击菜单栏超链接，只刷新菜单栏部分
将整个新页面放在菜单栏内显示

目标：超链接实现全页面刷新
超链接中增加target属性

<li><a href="/test/" target="_top">test</a></li>
Vue之在iframe标签里刷新外部页面
weixin_42949219的博客
01-30 2071
如果 是直接嵌套在父窗口中，你也可以使用 window.parent 来访问父窗口的 window 对象，并调用其 location.reload() 方法。你可以在 中通过 window.top 访问最顶层的 window 对象，然后调用其 location.reload() 方法来刷新外部页面。你可以通过 postMessage 向外部窗口发送消息，然后在外部窗口中监听该消息，并在接收到消息时执行刷新操作。这将导致包含 的整个页面被刷新。
js 能实现监听F5页面刷新子iframe 而父页面不刷新的方法
10-21
这里具体要解决的问题是，在用户按下F5键刷新页面时，我们希望只刷新子iframe而保持父页面不变。下面详细分析解决方案及知识点。 首先，我们需要了解的是，F5键在浏览器中通常用于刷新当前页面。当用户在包含iframe...
iframe 中嵌套刷新
weixin_30349597的博客
07-10 272
if(top.frames.length>0){top.location.href = window.location.href;} 转载于:https://www.cnblogs.com/weipeng/p/3835848.html
使用嵌套的iframe后怎么刷新父级页面
qq_44866810的博客
09-22 1431
如果使用window.location.reload();在当前页面刷新的话是没用的，影响不到父级页面。通常情况下，这段代码可能用于在嵌套的iframe或框架中的子页面中，当子页面需要刷新父级页面时执行。是JavaScript代码的一部分，它用于刷新包含当前页面的父级页面。
嵌套自动刷新html,iframe标签嵌套,刷新问题_html/css_WEB-ITnose
weixin_42541463的博客
06-10 230
现在解决的不是一个id就能搞定的问题,突然觉得自己好�!代码里面的iframe标签都是ExtJs打上去的,所以根本没去花精力去找生成的地方,即使找到了,修改框架也是不科学的,不废话了,开始使用的是: var alla = window.parent.frames; for( i in alla){ console.log(alla[i].location.h...
IFrame页面的刷新
06-24 1626
需求：一个页面有一个导航，根据不同的导航，下面显示的内容不同，这些不同的内容放在了一个IFrame中，从另外的一套系统中获取的数据，当点击导航的时候，IFrame的数据就要跟着动，也就是说IFrame就要请求一次。          从网上搜了很多来请求刷新的 例如：document.frames('iframename ').location.reload();      document.a
在vue中实现嵌套页面(iframe)
11-19
vue中嵌套iframe,将要嵌套的文件放在static下面。src可以使用相对路径，也可使用服务器根路径http:localhost:8088/… <iframe src=”../../static/plusPro.html” width=”1200″ height=”300″ frameborder=”...
demo_DEMO_子页面刷新父页面iframe_
09-30
标题“demo_DEMO_子页面刷新父页面iframe_”暗示我们关注的焦点是关于如何在子页面中触发父页面的刷新操作，特别是在一个IFrame上下文中。下面将详细探讨这个主题。 首先，我们需要了解IFrame（内联框架）的基本...
Vue组件中实现嵌套页面（iframe）功能
最新发布
06-30
在 Vue.js 开发中，利用 iframe 实现嵌套页面是一种常见方式。iframe 能在 Vue 应用里嵌入独立 HTML 文档，适用于展示第三方内容、实现特定功能或处理复杂交互场景。在 Vue 中使用 iframe，只需在模板插入 iframe ...
页面嵌套iframe后，点击里面的链接，然后父窗口跳转（子窗口控制父窗口的链接跳转）...
weixin_30933531的博客
05-06 650
做app的时候遇到一个问题，一个页面，然后里面嵌套了一个另一个页面，想实现点击里面的链接，然后外面进行跳转，不然的话，里面的页面永远出不来， 后面想了个办法，app的页面都是打开打开，不关闭的，然后由上一个页面用postmessage进行监听，然后子窗口发送信息给父窗口，父窗口接到信息后进行 页面跳转，Android可以，然而ios却不行，坑了；只能想另外一种办法，app打开页面不是...
再iframe中刷新列表
11-18
fly.js技术，再iframe中刷新父元素列表，再弹出层中刷新父框架
jquery给iframe添加链接
u011271164的博客
06-18 987
zhe
关于iframe 局部刷新 全部刷新 的解决办法以及嵌套 嵌套html页面
liyeford的博客
07-26 1万+
如果你想要局部刷新可以采用iframe来实现 但是当你点击一个当前ifram例如图一 希改整个页面刷新时候 往往出现这种情况望 只有局部被刷新了 你需要刷新整个页面 则需要这样做 如果是兄弟页面则 window.parent.frames[i].location.href="index.html"; i就是代表第几个iframe； 这样所有的真个页面就刷新了
解决iframe跳转不刷新整个页面小问题
闲笔杂叙
04-16 5919
type="text/javascript" > if (window != top) top.location.href = location.href;
同一页面中实现点击其中一个iframe中的链接后，将链接内容显示到另一iframe
atlim的专栏
03-20 3995
 同一页面中二个iframe，如何实现点击其中一个iframe中的链接后，将链接内容显示到另一iframe二个iframe id分别为 iframe1和iframe2,实现点击iframe1中的链接，显示到iframe2中iframe1 中包含一个 a.aspx, a.aspx中代码为： js部分： function   loadpage(page)       {    
iframe标签，子窗口页面更换刷新。
pckonline的博客
04-11 4892
毕设项目中对功能进行划分，大约分为六类，这些都在主页的一个导航栏中，原来是打算，对每一个划分都作为一个链接，点击后跳转到另一个页面，但是现在主流网站大部分并非如此做法，例如：点击导航栏中的某一个按钮，而这个导航栏一般在整体页面上方或者左侧，点击按钮后，页面主体并未发生变化，发生变化的仅仅是下方或者右侧，称为子窗口。实现原理：iframe标签,在一个合适的位置添加iframe标签，这里用的就是导航栏在
vue项目关于iframe嵌套的页面，在切换tab标签时会被重新刷新的问题处理方案
热门推荐
weixin_44900104的博客
03-16 1万+
vue项目关于iframe嵌套的页面，在切换tab标签时会被重新刷新的问题处理方案
jquery刷新iframe页面的方法（推荐第二种）
乔的博客
10-29 6856
jq强制刷新iframe页面
iframe引入的页面跳转之后刷新一下iframe
05-14
如果你想在 iframe 中加载的页面跳转后重新刷新 iframe，可以使用 JavaScript 中的 location.reload() 方法。当 iframe 中的页面跳转时，可以在父窗口中监听 iframe 的 load 事件，然后在事件处理程序中调用该方法实现刷新。 以下是示例代码： ```html <iframe id="myFrame" src="http://example.com"></iframe> <script> var myFrame = document.getElementById('myFrame'); myFrame.onload = function() { // 监听 iframe 的 load 事件 myFrame.contentWindow.location.reload(); }; </script> ``` 在上面的代码中，我们首先获取了 ID 为 myFrame 的 iframe 元素，然后在 onload 事件处理程序中监听了 iframe 的 load 事件。当 iframe 中的页面加载完毕后，我们调用了 contentWindow.location.reload() 方法，该方法可以刷新 iframe 中的页面。
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

779醒

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值