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++的内存操作小贴士” ...
随机推荐
- MySQL日期和时间函数
WEEKDAY( date ) 返回date的星期索引( = 星期天 ) . mysql> select WEEKDAY( '1997-10-04 22:23:00' ) ; mysql> ...
- 云主机上搭建squid3代理服务器
目录 目录 具体流程 修改配置文件 问题 维基整理 代理服务器 Squid (软件) SOCKS SOCKS代理 参考:http://raysmond.com/node/79 具体流程 在服务器上安装 ...
- 深层次详解Exception
所有的异常类都继承自System.Exception类,当异常产生时,CLR将创建该异常类的实例对象,将从最底层依次寻找合适的异常类型,同时若存在catch语句时将会选择最合适的语句进行处理. cat ...
- ios 8和iOS 9 适用的uidatepicker
UIAlertController *alertController = [UIAlertController alertControllerWithTitle:@"\n\n\n\n\n\n ...
- QR code 金庸小说体(二)
传说 在二维码世纪,流传着这样一个传说,long long ago,武林一片混乱,这时魔教二长老创立了一门绝世武功——QR code,随后称霸武林.但同时也遭到武林中人的觊觎和反抗,各大武林正派掌门人 ...
- Buffer
Buffer 我们用原有 IO 读写文件应该不会陌生了,顺带回顾一下,大致两种: 1. 在 InputStream 或 OutputStream 上读写字节或字节数组,读 InputStream 时用 ...
- PAT-乙级-1027. 打印沙漏(20)
1027. 打印沙漏(20) 时间限制 200 ms 内存限制 65536 kB 代码长度限制 8000 B 判题程序 Standard 作者 CHEN, Yue 本题要求你写个程序把给定的符号打印成 ...
- 成功解决Tomcat-JDBC-MySQL乱码
0.MySQL-JDBC驱动文档 官方解释 1.数据库的字符编码和表内字段的编码 在MySQL中数据库的字符编码和表内字段的编码的要指定为utf8(utf8_general_ci) 2.jsp中 pa ...
- Hybrid App 和 React Native 开发那点事
简介:Hybrid App(混合模式移动应用)开发是指介于Web-app.Native-App这两者之间的一种开发模式,兼具「Native App 良好用户交互体验的优势」和「Web App 跨平台开 ...
- python time相关操作
1.获取当前时间的两种方法: 代码如下: import datetime,timenow = time.strftime("%Y-%m-%d %H:%M:%S")print now ...