iframe的使用小贴士
1.之前又说到“根据内容计算iframe的高度”
2.现在想说的是,一般iframe页面都是嵌套在父页面当中,所以在一般在iframe里面做相关动作时默认都是iframe页面的,不会影响到父页面。因此若是需要在iframe的子页面里面操作父页面的元素,我们会如何做?
iframe 子页面操作父页面元素需要知道的两点是:
(1)iframe 子页面和父页面必须属于同一个域下。(这个问题,一般在本地页面来做到,是不太可能的,经常会有这个错误出现 “Uncaught SecurityError: Blocked a frame with origin "null" from accessing a frame with origin "null". Protocols, domains, and ports must match.”,故而一般的解决方案是放在服务器上去访问。 )
(2)iframe 页面获取父页面的对象方法是 parent。
例如:iframe 子页面获取父页面的id为mask的对象:$("#mask",parent.document)
$("#mask",parent.document).html() --------- id=mask的html内容
同理可以找到其他类型的对象
其次,就是父页面获取iframe子页面中的对象:$(window.frames["framename"].document).find("#id") 或者 $("#iframeid").contents().find("#id");
例如:$(window.frames["mainframe"].document).find("#mask2"); 中括号中的是iframe的名字,find后面则是对象的id。
详见链接:http://blog.csdn.net/zalion/article/details/5894103
3.使用iframe时,如何正确使用,一般使用iframe时,也是会有需要通过a标签切换的
例如:
<ul class="nav nav-list">
<li class="active parent_li"><a href="BSwelcome.aspx" target="mainframe"></li>
<li class="parent_li"><a href="MyContacts/MyInfoAssitant/BSMyInfoList.aspx?jb_id=&grade=all&&paixu=no®s=dd&cup=1" target="mainframe"></a></li>
<li class="parent_li"><a href="MyContacts/MyOrder/BSMyOrderList.aspx?cup=1&&sel=no" target="mainframe"></a></li>
<li class="parent_li"><a href="MyContacts/SubmitOrder/BSSubmitOrderList.aspx?cup=1" target="mainframe"></a></li>
</ul>
<iframe id="ifrma1" src="BSwelcome.aspx" name="mainframe" frameborder="no" scrolling="yes"
style="width: 100%; height: 100%;"></iframe>
一般iframe要有id值,name值,而a标签链接了地址,还要多一句 target="mainframe" 而mainframe就是iframe的name值。才不至于点击a标签直接跳过去。
iframe的使用小贴士的更多相关文章
- Angular2 小贴士 Name
Angular2 正式版已经发布了一个月了,我也是通过各种方式在进行验证是否可以满足我们的需求,今天我就发现了一个问题.现在我们来一起说明一下,这个可能不算是bug,而应该需要我们记住就可以了. 我们 ...
- 【小贴士】虚拟键盘与fixed带给移动端的痛!
前言 今天来公司的主要目的就是研究虚拟键盘与fixed的问题,期间因为同事问起闭包与事件委托(阻止冒泡)相关问题,便穿插了一篇别的: [小贴士]工作中的”闭包“与事件委托的”阻止冒泡“,有兴趣的朋友可 ...
- SVN小贴士
我辛辛苦苦写的到哪里了? SVN小贴士SVN服务器上的代码项目组公用,你的每一个提交都会体现给项目组每个人,所以提交要慎重,要注意避免代码冲突,使用SVN小贴士: 1.提前宣布开发计划,保持项目组成员 ...
- android性能小贴士 翻译
转自http://developer.android.com/training/articles/perf-tips.html 性能小贴士: 这篇文档主要一些微优化可以提升应用程序性能,但是这些改变不 ...
- 小贴士——提高PHP程序在NGINX代理服务器的性能
NGINX本身就是面向最大性能的代理服务器,因此在使用NGINX,并没有性能调整的配置工作.但是却有很多选项可用于定制NGINX的行为,利用底层硬件和操作系统. 下面将介绍用于提供PHP在NGINX的 ...
- jprofiler8使用小贴士
说明:本文的小贴士是针对jprofiler8的,其他版本上可能有不适用的地方 贴士一:使用jpenable监控,无需增加jvm参数和重启 贴士一:使用jpenable监控,无需增加jvm参数和重启 j ...
- 初识bd时的一些技能小贴士
既然小豆腐如此给力,而且充分的利用主动学习的优势,已经有了迅速脑补,压倒式的优势,不过这只是表面而已,一切才刚刚开始,究竟鹿死谁手,还有待验证. 以上可以看到,小豆腐为什么拼命的要teach我们了么, ...
- SharePoint每日小贴士Web部件
SharePoint每日小贴士Web部件 项目描写叙述 此Web部件从指定SP自己定义列表或一个选定的 RSS源选择一个随机项目.并显示一张图片.标题和一个Tip. 适 ...
- C和C++的内存操作小贴士(一):const char*的内存释放问题
C和C++的内存操作一直是困扰开发人员的老问题,基本概念相信老司机们都很清楚了,在这里就不做过多的描述了,只是把在实际开发中可能遇到的一些小问题的案例列举下,供大家参考.“C和C++的内存操作小贴士” ...
随机推荐
- Redis之七种武器
长生剑.孔雀翎.碧玉刀.多情环.离别钩.霸王枪.拳头是古龙笔下的七种武器,而本文打算将Redis的几种使用方式 Strings.Hashs.Lists.Sets.Sorted Sets.Pub/Sub ...
- input输入框的各种样式
输入框景背景透明: <input style="background:transparent;border:1px solid #ffffff"> 鼠标划过输入框,输入 ...
- python学习笔记26(python中__name__的使用)
在python中,每个py文件都是一个模块,也都是一个可执行文件,即包含main方法.因此,对每个py文件,可以单独运行,也可以import它给其他客户使用,这两种情况不一样. 1. 如果模块是被导入 ...
- iOS 的 Gif 渲染引擎 FLAnimatedImage-b
公司的项目有个首页加载一张2M左右的git图,刚做的时候是使用的SDWebImage里面的方法: + (UIImage *)sd_animatedGIFNamed:(NSString *)name; ...
- 3140:[HNOI2013]消毒 - BZOJ
题目描述 Description 最近在生物实验室工作的小 T 遇到了大麻烦. 由于实验室最近升级的缘故,他的分格实验皿是一个长方体,其尺寸为 a*b*c,a.b.c均为正整数.为了实验的方便,它被划 ...
- ExtJS4.2学习(二)Ext统一组件模型——Panel
鸣谢:http://www.shuyangyang.com.cn/jishuliangongfang/qianduanjishu/2013-11-06/171.html --------------- ...
- Oracle创建触发器实现主键自增
CREATE OR REPLACE TRIGGER "trigger_empl" before insert on extjsTest1.t_empl for each row b ...
- 关于hibernate中双向外键关联one-to-one的property-ref=的问题(转)
大家都知道hibernate中的one-to-one映射主要有两种策略,(1)一对一主键关联(单向和双向).(2)一对一外键映射(单项和双向).本文主要讲解一下,一对一外键映射中的双向问题,在此前先通 ...
- ppshu
全部书籍已经下载完毕! http://3cvpkfx4gdnkcduj.onion/ https://3cvpkfx4gdnkcduj.onion.cab/ https://3cvpkfx4gdnkc ...
- [Firefly引擎][学习笔记四][已完结]服务器端与客户端的通讯
原地址:http://www.9miao.com/question-15-54981.html 传送门:学习笔记一学习笔记二学习笔记三 前言:学习笔记三是模块封装,这个在持续开发中会不断更新, 因为写 ...