- 浏览: 166862 次
- 性别:
- 来自: 成都
文章分类
最新评论
-
crabboy:
goodhttp://veerle.duoh.com/comm ...
表格效果 -
lunvsxiao:
好呀,省的自己记那么多了。。
java常用正则表达式
父页面
<!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <script type="text/javascript"> var parentStr = "-----父页面的js变量-----"; function getValue(){ document.getElementById("getText").value = document.getElementById("framePage").contentWindow.document.getElementById("forParent").value; } function getJsVar(){ document.getElementById("getText").value = document.getElementById("framePage").contentWindow.childStr; } function getFunc(){ document.getElementById("framePage").contentWindow.testFunc(); } function testFunc(){ alert("子页面调用了此方法!"); } </script> </head> <body> 子页面获取<input type="text" id="forChild" value="parent"/><br/> <input type="text" id="getText"/> <button onclick="getValue()">获得子页面的值</button><button onclick="getJsVar()">获得子页面的Js变量</button><button onclick="getFunc()">调用子页面的Js方法</button><br/><br/><br/><br/><br/> <iframe id="framePage" name="framePage" style="width:100%;height:500px" src="childPage.html"/> </body> </html>
子页面
<!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <script type="text/javascript"> var childStr = "子页面的js变量"; function getValue(){ document.getElementById("getText").value = parent.document.getElementById("forChild").value; } function getParentJsVar(){ document.getElementById("getText").value = parent.parentStr; } function getFunc(){ parent.testFunc(); } function testFunc(){ alert("父页面调用了此方法!"); } </script> </head> <body> 父页面获取<input type="text" id="forParent" value="child"/><br/> <input type="text" id="getText"/> <button onclick="getValue()">获得父页面的值</button><button onclick="getParentJsVar()">获得父页面的Js变量</button><button onclick="getFunc()">获得父页面的值</button> </body> </html>
经验总结:
1. 子页面调用父页面不会有什么大的问题。但父页面调用子页面时需要确保子页面已经加载完成,不然就会报错。这个无需多说。 有两种解决方式:
1) 在父页面用setTimeout设置延时调用
2) 在子页面onload完成后,触发父页面来调用子页面。
2. 注意:在web开发过程中,有时出现问题,需要考虑HTML 文档遵循的文档类型是否有影响。
如:<!DOCTYPE html 。。。。。。。。
- 父页面与子页面之间的相互调用.rar (1.3 KB)
- 下载次数: 11
发表评论
-
img 图片显示多余空白解决方法
2014-09-03 23:01 0img 图片显示多余空白解决方法:在进行DIV+CSS排版时 ... -
js event.keyCode
2011-12-02 17:13 678keycode 8 = BackSpace BackSpace ... -
js event.keyCode
2011-12-02 17:06 2keycode 8 = BackSpace BackSpace ... -
IE6下png透明处理心得
2011-11-24 12:41 1267首先说明一下,网上处理IE6下png透明的方法有很多,但无外乎 ... -
我的笔记
2011-10-25 22:52 0http://www.ccxcn.com/blog/post/ ... -
HTTP状态码(HTTP Status Code)
2011-02-23 09:40 6871xx(临时响应)表示临时响应并需要请求者继续执行操作的状态代 ... -
上传图片预览-兼容IE6,IE7,IE8,FF
2011-01-20 14:07 691<!DOCTYPE html PUBLIC " ... -
动态加载javascript文件
2010-12-23 23:53 690动态加载javascript?很俗的一个题目,如果你已经知道如 ... -
Apache相关配置
2010-11-30 22:15 709强制IE缓存CSS中定义的图片 document.execC ... -
表格效果
2010-07-14 18:07 759web应用中的表格效果。 鼠标滑动时选中横行和竖列。 见附 ... -
所有浏览器中都能正常显示的字体
2010-07-04 01:31 933很佩服国外一些前端开发人员对待学问的研究精神,他们很善于总结发 ... -
隐藏IE窗口自带的“Windows Internet Explorer”
2010-05-17 10:34 1684var whiteStr = ""; f ... -
当加载flash或者弹出窗口时,Internet Explorer显示安全提示
2010-05-05 11:50 1893当我们在开发web前端时,有时加载的swf文件或者某些js文件 ... -
CSS选择器笔记
2010-03-20 11:17 1384http://www.456bereastreet.com/a ... -
美化表单
2010-01-14 22:42 1259首先介绍一个设计很不错的网站:http://utombox.c ... -
你是如何让position:fixed在IE6中工作的
2010-01-09 17:20 2259你是如何让position:fixed在IE6中工作的? 本 ... -
动态加载css的实现思路
2010-01-04 15:50 1422动态加载css的实现思路,目前想到有两种: 一、js 主要 ... -
滚动列表
2010-01-04 13:13 1086<MARQUEE onmouseover=this.st ... -
淡入淡出DIV层效果
2009-12-29 18:09 2065<html> <head> &l ... -
生成Table,然后赋值
2009-12-23 10:42 1377主要用于需要对比的时候: <!DOCTYPE H ...
相关推荐
本Demo汇总是iframe父页面与iframe子页面如何相互调用方法、元素及值的几种常见方法(含JS、JQuery方法)
(1)子页面调用父页面的方法或者变量: window.parent.方法()或者变量名 window.parent相当于定位到父页面 之后的操作和在父页面中写代码一样写 window.parent.aa();//调取aa函数 window.parent.bb;//调取bb变量 ...
以一个简单的小例子讲述了iframe页面中的相互调用,此为iframe页面中又嵌套iframe的页面的例子,希望对大家有帮助
NULL 博文链接:https://block.iteye.com/blog/625772
2、父窗口调用子窗口:myFrame.window.functionName(); 3、子窗品调用父窗口:parent.functionName(); 简单地说,也就是在子窗口中调用的变量或函数前加个parent.就行 4、父窗口页面源码: 代码如下: <html> &...
WPF简单导航框架,Window和Page(父窗体与子页面)方法相互调用。
(js)父子页面相互调用总结(js)父子页面相互调用总结(js)父子页面相互调用总结(js)父子页面相互调用总结
用户控件开发中的实用技术,实现控件与父页面及相互间方法调用和属性访问
但是,如果一个文档定义了一个或者多个框架(即:包含一个或者多个frame或者iframe标签),浏览器就会为原始文档创建一个window对象,再为每个iframe创建额外的window对象,这些额外的window对象是原始窗口的子窗口。...
本文给大家介绍了JavaScript中的子窗口与父窗口的互相调用问题,非常不错,具有参考借鉴价值,需要的朋友参考下吧
Android关于HTML页面与Native方法相互调用
今天小编就为大家分享一篇layer弹出层父子页面事件相互调用方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
安卓webview中h5页面里的js和java相互调用,js和Android代码相互调用
一个宿主页面当中嵌入2个XAML页面并互相调用 一个宿主页面当中嵌入2个XAML页面并互相调用
其实,他们之间的调用还是很简单的~ 基础篇 一、父页面调用子页面中的JS 我们先创建一个子窗体 代码如下: var win $(function () { Root = $(‘#Root’).val();//设置根目录 }); function OpenPlayer(id, type, add)...
内涵iframe子页面调用兄弟页面的demo console 输出函数的自定义方法
WPF简单导航框架,Window和Page(父窗体与子页面)方法相互调用。
js与aspx相互调用js与aspx相互调用js与aspx相互调用js与aspx相互调用