JQueryiframe页面操作父页面中的元素与方法(实例讲解)
1)在iframe中查找父页面元素的方法:
$('#id', window.parent.document)
2)在iframe中调用父页面中定义的方法和变量:
parent.method
parent.value
3)实例
1.父页面
<!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 runat="server">
<title></title>
<script language="javascript" type="text/javascript" src="jquery-1.5.1.min.js"></script>
<script language="javascript" type="text/javascript">
var hello = 'hello';
function getHelloWorld() {
alert('hello world');
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<div id="default" style=" width:200px; height:400px; float:left;">default.aspx</div>
<iframe id="iframeid" src="IFrame.aspx" style=" width:400px; height:400px; float:left;"></iframe>
</div>
</form>
</body>
</html>
2.子页面
<!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 runat="server">
<title></title>
<script language="javascript" type="text/javascript" src="jquery-1.5.1.min.js"></script>
<script language="javascript" type="text/javascript">
$(function() {
//在iframe中查找父页面元素
alert($('#default', window.parent.document).html());
//在iframe中调用父页面中定义的方法
parent.getHelloWorld();
//在iframe中调用父页面中定义的变量
alert(parent.hello);
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="iframe">
IFrame.aspx
</div>
</form>
</body>
</html>
JQueryiframe页面操作父页面中的元素与方法(实例讲解)的更多相关文章
- 在子页面操作父页面元素和iframe说明
实现功能:在子页面操作父页面元素. 在实际编码的过程中,大家一定有这种需求:在父级页面有一个<iframe scrolling='auto'></iframe>内联框架,而我们 ...
- iframe子页面操作父页面并实现屏蔽页面弹出层效果
- js 在iframe子页面获取父页面元素,或在父页面 获取iframe子页面的元素的几种方式
用JS或jquery访问页面内的iframe,兼容IE/FF 注意:框架内的页面是不能跨域的! 假设有两个页面,在相同域下. index.html 文件内含有一个iframe: XML/HTML代码 ...
- AppBox v6.0中实现子页面和父页面的复杂交互
前言 1. AppBox是捐赠开源(获取源代码至少需要捐赠作者 1 元钱),基于的 FineUI(开源版)则是完整开源,网址:http://fineui.codeplex.com/ 2. 你可以通过捐 ...
- 使用iframe父页面调用子页面和子页面调用父页面的元素与方法
在实际的项目开发中,iframe框架经常使用,主要用于引入其他的页面.下面主要介绍一下使用iframe引入其他页面后,父页面如何调用子页面的方法和元素以及子页面如何调用父页面的方法和元素. 1.父页面 ...
- iframe子页面获取父页面元素的方法
在iframe子页面获取父页面元素 代码如下: $.('#objld', parent.document); 在父页面获取iframe子页面的元素 代码如下: $("#objid" ...
- iframe父页面获取iframe子页面的元素 与 iframe子页面获取父页面元素
一.在iframe子页面获取父页面元素代码如下:$('#objld', parent.document); 二.在父页面获取iframe子页面的元素代码如下:$("#objid", ...
- jQuery子页面获取父页面元素
$("input[type='checkbox']:checked",window.opener.document);//适用于打开窗口的父页面元素获取 $("input ...
- jquery读取iframe子页面和父页面的处理
1. jquery 在iframe子页面获取父页面元素代码如下: $("#objid", parent.document) 2. jquery在父页面 获取iframe子页面的元素 ...
随机推荐
- CentOS下的强大的绘图工具 pinta
[root@ok ~]# yum search pinta Loaded plugins: fastestmirror, refresh-packagekit, security Loading mi ...
- android.view.animation(2) - 插值器Interpolator
public interface Interpolator implements TimeInterpolator android.view.animation.Interpolator Known ...
- Git Manual / Git使用手册 / Git, GitLab, Git Bash, TortoiseGit (建议全文复制到Word文档中通过导航窗格查看)
Git使用手册 目录 1 引言 2 Git.GitLab简介 2.1 Git 2.2 GitLab 2.3 Git基本概念 3 运行环境 4 ...
- WebSocket请求过程分析及实现Web聊天室
WebSocket协议是基于TCP的一种新的协议.WebSocket最初在HTML5规范中被引用为TCP连接,作为基于TCP的套接字API的占位符.它实现了浏览器与服务器全双工(full-duplex ...
- 高效学习Oracle的方法论
Oracle的很多经验并不是来自工业环境.很多问题和经验都可以从自己的测试里积累 实验要做,但也要想! 那思维的起点是什么? 以下是我的看法.或者有些不合理: ...
- mof提权原理及其过程
mof提权的原理: mof是windows系统的一个文件(在c:/windows/system32/wbem/mof/nullevt.mof)叫做"托管对象格式"其作用是每隔五秒就 ...
- 安装expect命令 两种方式
yum安装 yum -y install expect 手动安装 expect以及tcl版本 #!/bin/bash oldpath=`pwd` tar -zxf tcl8.4.20-src.tar. ...
- Unix系统编程()进程内存布局
每个进程所分配的内存由很多部分组成,通常称之为"段(segment)". 文本段包含了进程运行的程序机器语言指令.文本段具有只读属性,以防止进程通过错误指针意外修改自身指令. 因为 ...
- HTTP Status 404–/webDemo/hello
现在用一排很小的字写出来,我真是个大傻逼
- LigerUI 树状列表折叠显示
http://blog.csdn.net/haojuntu/article/details/8626040 —————————————————————————————————————————————— ...