window.parent与window.openner
window.parent与window.openner区别介绍
今天总结一下js中几个对象的区别和用法,对这几个概念混淆的朋友可以看看
今天总结一下js中几个对象的区别和用法:
首先来说说 parent.window与top.window的用法
"window.location.href"、"location.href"是本页面跳转
"parent.location.href"是上一层页面跳转
"top.location.href"是最外层的页面跳转
举例说明:
如果A,B,C,D都是jsp,D是C的iframe,C是B的iframe,B是A的iframe,如果D中js这样写
"window.location.href"、"location.href":D页面跳转
"parent.location.href":C页面跳转
"top.location.href":A页面跳转
现在终于明白了连接的时候target的用法了:
_blank:重新打开一个窗口
_parent:父窗口执行重定向
_self:自身页面重定向
_top:第一个父窗口重定向
综上所述可知:parent.window:父窗口对象 top.window:第一个父窗口的对象
下面来重点看看window.parent与window.openner区别
window.parent 是iframe页面调用父页面对象,当我们想从iframe内嵌的页面中访问外层页面是可以直接利用window.parent获取;
例子如下:
A.html
复制代码代码如下:
<html>
<head>
<title>父页面</title>
</head>
<body>
<form id="form1" action="">
<div>
输入值:
<input type="text" name="username" id="username" /><br />
<iframe src="b.html" width="400px" height="300px"></iframe>
</div>
</form>
</body>
</html>
B.html
复制代码代码如下:
<html>
<head>
<script type="text/javascript">
function getpValue()
{
document.getElementByIdx_x_x_x("span1").innerText=window.parent.document.getElementByIdx_x_x_x("username").value;
}
</script>
</head>
<body>
<span>文本框值为:</span><span id="span1"></span><br />
<input type="button" value="获取父窗口内的文本框值" onclick="getpValue();">
</body>
</html>
window.opener 是window.open或超链接<a> 打开的子页面调用父页面对象
例子如下
a.html
复制代码代码如下:
<html>
<head>
<title>父页面</title>
<script type="text/javascript">
function openB()
{
window.open('b.html','b','width=400,height=200,status=no,toolbar=no,menubar=no,location=no,resizable=yes,left=200,top=100');
}
</script>
</head>
<body>
<form id="form1" action="">
<div>
输入值:
<input type="text" name="username" id="username" /><br />
<input type="button" value="打开窗口B" onclick="openB();" /><br />
<a href="b.html" target="_blank">超链接打开B页面</a>
</div>
</form>
</body>
</html>
b.html
复制代码代码如下:
<html>
<head>
<script type="text/javascript">
function getpValue()
{
document.getElementByIdx_x_x_x("span1").innerText=window.opener.document.getElementByIdx_x_x_x("username").value;
}
</script>
</head>
<body>
<span>文本框值为:</span><span id="span1"></span><br />
<input type="button" value="获取父窗口内的文本框值" onclick="getpValue();">
</body>
</html>
下面来举几个常用的例子:
parent.window与top.window一般在分割的页面即 frameset或iframe中使用
注销整个框架后返回到login.aspx:parent.window.location='Login.aspx'或者
top.window.location='Login.aspx'
window.parent也是常在框架中使用,
刷新:window.parent.location.reload();或者刷新某个框架:window.parent.MainForm.location.reload();
获得其他框架的元素值:window.parent.MainForm.form1.text1.value;
window.opener主要是获得通过超链接或者 window.open() 打开本身页面的页面的一些,比如获得值,刷新等
刷新:window.opener.location.reload();
获值:window.opener.document.getElement("txtName").value;
后退:top.playFrame.history.go(-1);
前进: top.playFrame.history.go(1);
刷新: top.playFrame.location.reload();
就总结到这里,这些对象很实用
window.parent与window.openner的更多相关文章
- window.parent与window.openner区别介绍
今天总结一下js中几个对象的区别和用法: 首先来说说 parent.window与top.window的用法 "window.location.href"."locati ...
- JavaScript中,window.opener是什么?window.parent和window.opener有啥区别?
来自CSDN的问答: window.opener是什么啊? ++++++++++++++++++++++++++++++++++++++++++++++++++ 弹出本窗体的句柄 比如你想点一个按钮直 ...
- window.parent与window.opener的区别
有这样一个需求,弹出一个新窗口 并从该新页面的select选择框中选择需要的类别,再返回到之前的父窗口页面的某个文本框中.这里就要用到window.parent和window.opener 如题两种方 ...
- (转)window.parent和window.opener区别
下面一段代码是关于window.parent和window.opener区别 来讲的,我们如果要用到iframe的值传到另一框架就要用到window.opener.document.getElemen ...
- window.parent与window.openner 之前的总结
今天总结一下js中几个对象的区别和用法: 1.首先来说说 parent.window与top.window的用法 "window.location.href","loca ...
- window.parent 与 window.opener
window.parent针对iframe,window.opener针对window.open 父页面parent.jsp: <%@ page language="java" ...
- window.parent与window.opener的区别与使用
window.parent 是iframe页面调用父页面对象 举例: a.html 如果我们需要在b.html中要对a.html中的username文本框赋值(就如很多上传功能,上传功能页在ifrma ...
- window.parent 与 Window.top
window.parent 返回当前窗口的父窗口对象. 如果一个窗口没有父窗口,则它的 parent 属性为自身的引用. 如果当前窗口是一个 <iframe>, <object> ...
- window.parent 、window.top及window.self 详解
在应用有frameset或者iframe的页面时,parent是父窗口,top是最顶级父窗口(有的窗口中套了好几层frameset或者iframe),self是当前窗口. 1. window.self ...
随机推荐
- iOS 在UILabel显示不同的字体和颜色
转自:http://my.oschina.net/CarlHuang/blog/138363 在项目开发中,我们经常会遇到在这样一种情形:在一个UILabel 使用不同的颜色或不同的字体来体现字符串, ...
- java课程三课堂例子验证
1.ClassAndObjectTest.java 验证截图: 2.ObjectEquals.java 运行截图: 3.InitializeBlockDemo.java Java进行初始化的地方有 ...
- Yii数据库操作增删改查-[增加\查询\更新\删除 AR模式]
在Yii的开发中常常需要去使用Yii的增删改查方法,这些方法又可以多次变化和组合,带来全方位的实现对数据库的处理,下面对这些方法做一些简单的整理和梳理,有遗漏或是BUG,敬请指出.灰常感谢!!! 一. ...
- linux下vi命令
Vi共分三种模式,分别是“一般模式”.“编辑模式”与“命令行命令模式”. 1.一般模式:vi处理文件时,一进入该文件就是一般模式.在这个模式中,可以使用“上下左右”键来移动光标,可以使用“删除字符”或 ...
- ie7下 滚动条内容不动问题
ie7+ 版式正常 ie7滚动内容不跟着动 解决方法 加上 overflow-x: hidden; overflow-y: auto; *position:relative; *le ...
- ERP联系记录管理(十七)
联系记录管理修改页面: <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Co ...
- 简单的多线程(活用OD解决运行时错误)
代码源自<VC++深入详解>第15章 “多线程”,位于第563页 - 566 页. 程序的目的是展示多线程运行的效果: #include <windows.h> #includ ...
- PHP date和time
一.time()函数 time():得到一个数字,这个数字表示从1970-01-01到现在共走了多少秒. 前一天的时间就是 time()-60*60*24. 前一年的时间就是 time()-60*60 ...
- turn.js实现翻书效果
JS插件网 http://www.ijquery.cn/?p=173 描述:Turn.js 是一个轻量级的 (15kb) jQuery/html5 插件用来创建类似书本和杂志翻页效果,支持触摸屏设备. ...
- I.MX6 KEY_ROW4 can't as GPIO pin
/********************************************************************** * I.MX6 KEY_ROW4 can't as GP ...