新打开的页面没有在指定的iframe显示问题

理解HTML中iframe与目标属性
最新推荐文章于 2021-08-05 12:21:43 发布
原创 最新推荐文章于 2021-08-05 12:21:43 发布 · 347 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#开发工具

本文详细解析了HTML中iframe元素的使用方法，特别是如何正确设置target属性以避免页面在新窗口中打开，以及与之相关的前端开发基础知识。

index.jsp中定义的<iframe id="mainIfra" src="#"></iframe>

left.html中的连接 <a href="#" target="mainIfra"></a>，点击left.html中的连接，打开的页面总是在新窗口打开，后来才知道target指的iframe的名字，为了保险起见，最好这样定义<iframe id="mainIfra" name="mainIfra" ></iframe>

 

 

frame必须和frameset一起使用

qwertywwt
关注
【SaaS-Export项目】 - 05 部署项目UI界面，将AdminLTE页面部署到项目中，iframe来装载内容区域（iframe实现页面嵌套）
Java小皮孩
10-29 1404
部署export项目的UI 步骤： （1）将前面的AdminLTE的项目页面的内容复制到webapp下 （如果页面杂乱，一定是css没有引入有问题 点击有问题，是js引入有问题 图片显示不正常，是img引入有问题） 将模板导入，测试运行结果。 （2）将主页面里面的页面拆分拉出来，为了以后能够修改更方便。 （2）设置项目路径${path} 重新部署，并将通用的css、js抽出来放到上一层的base.jsp中，使用的时候导入就行。 （3）通过控制器请求转发来访问WEB-INF下的主页面 @Controll
拦截器重定向页面 设置不在 iframe中显示
欢迎所有人，批评指正！
12-09 401
如果你要重定向到 login 页面可以在 login 页面的head中加入 <script type="text/javascript"> if (window != top) top.location.href = location.href; </script>
ajax刷新iframe页面,ajax效果模拟——隐藏的iframe无刷新效果
weixin_33657499的博客
08-05 309
在ajax流行之前如何实现无刷新提交表单呢？其实用隐藏的iframe完全可以实现该功能，看一个测试的小例子。ryAdd.jsp// 全局方法function reset(){$("txtID").val("");$("txtName").val("");}编号姓名Actionpublic class ryAction{private String msg;public String ryAdd(...
iframe里面打开链接如何还是在iframe框架里面？ iframe里面打开链接为什么还是在iframe框架里面
waj89757的专栏
01-20 5500
target属性 可以控制打开的页面是在自己的框架中，还是在父类的框架中，还是新的等等。 在iframe要链接的页面中加上 设计家园 href的target有四个属性，分别是：_blank,_self,_parent,_top，这四个各自代表的意思也不多说了， 也可以自己给target里写_加网页的头名称 给target属性命名为my_tar，当点击链接的时候，如果没有名
在iframe框架中打开页面的方法
09-22
5. 相同窗口、新窗口打开链接：除了在指定iframe中打开链接，target属性还支持几个特殊的值，如“_blank”可以打开链接在一个新的浏览器窗口或标签页中，而“_self”和“_parent”则分别在当前窗口或当前框架的父...
iframe中页面显示不全1
08-08
在网页设计中，`<iframe>`元素是一种非常实用的工具，它允许我们在一个网页中嵌入另一个网页，比如展示文档、视频或者地图等。当遇到"Iframe中页面显示不全"的问题时，通常是由于iframe的尺寸设置不当或者与被嵌入...
layui问题之自动滚动二级iframe页面到指定位置的方法
01-21
刚开始，以为只要滚动iframe里面的元素就行了，页面所有元素都在section里面，就通过section使滚动条滚动 $('section.layui-larry-box').scrollTop(300); 可想而知，不行 然后，又试了div啥的 最后直接试了包含这...
ASP.NET中iframe框架点击左边页面链接 右边显示链接页面内容
10-21
在***中实现点击左边页面链接时，右边iframe框架显示对应链接页面的内容，是一种常见的网页布局模式，经常被用于后台管理系统中。这种布局允许用户在一个窗口内操作导航，而在另一个子窗口内查看和处理内容，从而...
html 在框架里弹出页面,iframe弹出新窗口 iframe页面打开新窗口问题
weixin_29997223的博客
06-03 7238
如何使iframe中的链接都在新窗口打开a.html文件源码如下 如何让所有链接在新窗口打开2008-07-24 21:26使用target="blank"属性 open 注意：XHTML 1.1 规范已经不支持“target='_blank'页面上所有的链接都在新窗口打开 在区加入base代码：利用expression来执行javascript语句。jquery添加双击事件，双击后弹出一个新...
nw.js如何强制iframe中的连接在本窗口打开而不是新打开tab页？
oldkang的博客
01-25 4650
var gui = require('nw.gui'); var win = gui.Window.get(); win.on('new-win-policy', newWinPolicyHandler); function newWinPolicyHandler(frame, url, policy) { policy.ignore(); //ignore policy fi...
iframe 禁止打开新窗口_打开新窗口的安全和性能问题
weixin_39548776的博客
12-01 2854
相信大部分同学都接到过"点击页面某个地方从新窗口打开一个页面"的需求,一般这个需求都有一下两种处理方式来完成:1.a标签加上target="_blank"属性2.window.open(url)但是以上两种处理方式可能会遇到已下问题:1. 用户账户或个人信息被盗取2. 打开新页面后,原窗口页面出现卡顿情况经过一顿猛操...
那些不常见，但却非常实用的css属性(整理不易)
前端开发博客
06-16 467
还别说下面很多CSS我都没见过，你也看看https://segmentfault.com/a/11900000228515431、-webkit-line-clamp可以把 块容器 中的...
页面中加载iframe的常见问题总结
weixin_30394981的博客
09-28 838
1、页面引用ifram <iframe src="URL" id="iframe" name="iframe" frameborder="0" marginwidth="0" align="left" height="550px" width="100%" scrolling="auto" marginheight="0"　　　　onload="setIframeHeight()"&...
iframe 嵌入页面后无法显示的问题
热门推荐
qq_38719039的博客
09-04 2万+
查看浏览器控制台发现： X-Frame-Options可用于指示是否应该允许浏览器呈现在一个页面<FRAME> 或 <IFRAME>中. 以确保网站内容是不是嵌入到其它网站. <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="X-Frame-Options" content="SAMEORIGIN / D...
HTML表单提交后不弹出新窗口
若星
12-04 5457
一、修改form的target属性 &lt;form name="Myform" action="login/login.php" method="POST" onsubmit="return validateForm()" target="_parent" &gt; &lt;input class="pass" ty
vue中iframe 打开新网址避免跨域问题
最新发布
10-16
在 Vue 项目中使用 `iframe` 打开新网址避免跨域问题，可采用以下方法： ### 使用 `postMessage` API `postMessage` 是 HTML5 引入的一个跨域通信的方法，可以在不同源的窗口之间传递消息。以下是示例代码： #### 父组件（Vue 页面） ```vue <template> <div> <iframe ref="myIframe" src="http://targetdomain.com"></iframe> <button @click="sendMessage">Send Message</button> </div> </template> <script> export default { data() { return { message: 'Hello from parent' }; }, methods: { sendMessage() { const iframe = this.$refs.myIframe; const targetWindow = iframe.contentWindow; targetWindow.postMessage(this.message, 'http://targetdomain.com'); } }, mounted() { window.addEventListener('message', (event) => { if (event.origin === 'http://targetdomain.com') { console.log('Received message from iframe:', event.data); } }); } }; </script> ``` #### 子页面（`iframe` 中的页面） ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> </head> <body> <script> window.addEventListener('message', (event) => { if (event.origin === 'http://parentdomain.com') { console.log('Received message from parent:', event.data); event.source.postMessage('Hello from iframe', event.origin); } }); </script> </body> </html> ``` ### 后端设置允许嵌套 在后端代码中主动设置允许嵌套，以 Django 为例： ```python # settings.py X_FRAME_OPTIONS = 'ALLOW-FROM http://你的域名.com' # 指定允许嵌套的域名 ``` 通用方案是在 HTTP 响应头中添加： ```plaintext X-Frame-Options: ALLOW-FROM http://你的域名.com Content-Security-Policy: frame-ancestors 'self' http://你的域名.com ```
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值