首页 »Javascript教程 » javascript父窗口:javascript调用父窗口(父页面)的思路方法 »正文javascript父窗口:javascript调用父窗口(父页面)的思路方法来源: 发布时间:星期六, 2009年2月14日 浏览:0次 评论:0
="t18">window.parent和window.opener
 区别 javascript 主窗口思路方法1: window.parent 是  rame页面父页面对象举例: a.html Html代码 <html> <head><title>父页面</title></head> <body> <form name="form1" id="form1"> <input type="text" name="username" id="username"/> </form> < rame src="b.html" width=100%></rame> </body> </html> 如果我们需要在b.htm中要对a.htm中 username文本框赋值 就如很多上传功能上传功能页在Ifrmae中上传成功后把上传后路径放入父页面文本框中我们应该在b.html中写 Html代码 <script type="text/javascript"> var _parentWin = window.parent ; _parentWin.form1.username.value = "xxxx" ; </script> 例子地址: http://www.cnspry.cn/blog/attachments/window.parent 例子/a.html 源码: 1.a.html Html代码 <html> <head> <title>主页面</title> <script> /** 为测试IFrame子窗口 父窗口全局变量而添加测试变量 */ var parentVairous = "为测试IFrame子窗口 父窗口全局变量而添加测试变量"; function parentInvokeIFrame  { var rameTest = document.frames["rameTest"]; //使用document.getElementById("rameTest");同样可以 alert( rameTest.document.body.innerHTML); alert( rameTest.iFrameVair); } </script> </head> <body> <form name="form1" id="form1"> <input type="text" name="username" id="username"/> <input type = "button" value = "父窗口 IFrame子窗口中内容" _disibledevent=></form> < rame src="b.html" width = '100%' id = 'rameTest'></rame> </body> </html> 1.b.html Html代码 <html> <head> <title></title> <script type="text/javascript"> /** 为测试父窗体 IFrame子窗体全局 而添加子窗口全局 */ var iFrameVair = "测试父窗体 IFrame子窗体全局"; function UpdateParent { var _parentWin = window.parent ; _parentWin.form1.username.value = "xxxx" ; } function childInvokeParent { var parentVairous = window.parent.window.parentVairous; alert(parentVairous); } </script> </head> <body> <form name="form1" id="form1"> <p> </p> <p align="center"> <input type = "button" name = "button" id = "button" value = "更新主页面 UserName内容" _disibledevent=> <input type = "button" name = "button2" id = "button2" value = "测试IFrame子窗口 父窗口全局变量" _disibledevent=> </p> <p> </p> </form> </body> </html> ps:不能跨域获取 例如ramesrc是'http://www.xxx.ccc/'就不可以2: window.opener 是window.open 打开 子页面父页面对象例子地址: http://www.cnspry.cn/blog/attachments/window.opener 例子/a.html 源码: 2.a.html Html代码 <html> <head> <title>主页面</title> <script type="text/javascript"> /** 为测试IFrame子窗口 父窗口全局变量而添加测试变量 */ var parentVairous = "为测试IFrame子窗口 父窗口全局变量而添加测试变量"; /** *  区别于IFrame(IFrame有id,window.open和IFrame父子窗口模式区别), * 所以当是通过window.open 思路方法打开 个新窗口使, 必须有个新窗口对象 * 当然必须先让子窗口弹出来, 才能 子窗口中变量, 否则抛出异常 */ var OpenWindow; function openSubWin { OpenWindow = window.open('b.html', '  window', 'height=1024, width=1300, top=0, left=0, toolbar=no, menubar=yes, scrollbars=yes,resizable=yes,location=no, status=no'); } function parentInvokeChild { (OpenWindow)//当然必须先让子窗口弹出来, 才能子窗口中变量, 否则抛出异常 { alert(OpenWindow.iFrameVair); } } </script> </head> <body> <form name="form1" id="form1"> <input type="text" name="username" id="username"/> <input type="button" value="弹出子页面" _disibledevent=> <input type="button" value="测试 弹出窗口中全局变量" _disibledevent=> </form> </body> </html> 2.b.html Html代码 <html> <head> <title>子页面</title> <script type="text/javascript"> /** 为测试父窗体 IFrame子窗体全局而添加子窗口全局 */ var iFrameVair = "测试父窗体 IFrame子窗体全局"; function UpdateParent { var _parentWin = window.opener; _parentWin.form1.username.value = "xxxx" ; } function childInvokeParent { var parentVairous = window.opener.window.parentVairous; alert(parentVairous); } </script> </head> <body> <form name="form1" id="form1"> <p> </p> <p align="center"> <input type="button" _disibledevent=> name="button" id="button" value="更新主页面 UserName内容"> <input type = "button" name = "button2" id = "button2" value = "测试IFrame子窗口 父窗口全局变量" _disibledevent=></p> <p> </p> </form> </body> 经过hanjs 提醒确实需要注意是模态窗口子窗口是没有办法修改父窗口页面中任何内容 例如修改:OpenWindow = window.open('b.html', ' window', 'height=1024, width=1300, top=0, left=0, toolbar=no, menubar=yes, scrollbars=yes,resizable=yes,location=no, status=no');为:OpenWindow = window.showModalDialog("b.html",' window',"dialogHeight:100px,center:yes,resizable:no,status:no");在子窗口中当希望修改父窗口中 内容时会弹出“某某”为空或不是对象 而这里“某某”就是你想修改父窗口中内容0
相关文章读者评论发表评论 |
|
 |
专注于互联网--专注于架构 |
最新标签 网站地图 文章索引 Rss订阅 |
