- 浏览: 287605 次
- 性别:
- 来自: 上海
文章分类
最新评论
-
wahahachuang5:
web实时推送技术使用越来越广泛,但是自己开发又太麻烦了,我觉 ...
java以post发送方式实现百度Sitemap实时推送代码分享 -
fmpoffice:
发来感谢!准备尝试!https://m.yooshifu.co ...
java以post发送方式实现百度Sitemap实时推送代码分享 -
playboyhaolei:
爱死博主了 学习了 已经成功的推送了 ...
java以post发送方式实现百度Sitemap实时推送代码分享 -
playboyhaolei:
爱死博主了 学习了 已经成功的推送了 ...
java以post发送方式实现百度Sitemap实时推送代码分享 -
真三武侯:
爱死博主了
java以post发送方式实现百度Sitemap实时推送代码分享
Javascript弹出子窗口
可以通过多种方式实现,下面介绍几种方法
(1) 通过window对象的open()方法,open()方法将会产生一个新的window窗口对象
其用法为:
window.open(URL,windowName,parameters);
URL: 描述要打开的窗口的URL地址,如何为空则不打开任何网页;
windowName:描述被打开的窗口的民称,可以使用'_top'、'_blank'等内建名称,这里的名称跟<a href="..." target="...">里的target属性是一样的。
parameters:描述被打开的窗口的参数值,或者说是样貌,其包括窗口的各个属性值,及要传入的参数值。
例如:
打开一个 400 x 100 的干净的窗口:
open('','_blank','width=400,height=100,menubar=no,toolbar=no,
location=no,directories=no,status=no,scrollbars=yes,resizable=yes')
也可以这样写: var newWindow = open('','_blank');
参数说明如下:
top=# 窗口顶部离开屏幕顶部的像素数
left=# 窗口左端离开屏幕左端的像素数
width=# 窗口的宽度
height=# 窗口的高度
menubar=... 窗口有没有菜单,取值yes或no
toolbar=... 窗口有没有工具条,取值yes或no
location=... 窗口有没有地址栏,取值yes或no
directories=... 窗口有没有连接区,取值yes或no
scrollbars=... 窗口有没有滚动条,取值yes或no
status=... 窗口有没有状态栏,取值yes或no
resizable=... 窗口给不给调整大小,取值yes或no
(2) 在javascript中除了通过open()方法建立window对象实现弹出窗口外,还可以通过建立对话框的方式弹出窗口。
如:
alert(""); //弹出信息提示对话框
confirm(""); //弹出信息确认对话框
prompt(""); //具有交互性质的对话框
但是,上述实现的弹出窗口具有的功能较为单一,只能完成较为简单的功能。对于需要在对话框中显示多个数据信息,
甚至是HTML控件就无能为力了。
(3) 使用模态对话框实现复杂的对话框需求
在javascript的内建方法中还有一类方法可以实现通过对话框显示HTML内容,
也就是说可以通过创建对话框的方式来完成创建窗口对象所能完成的功能。
包括创建模态对话框和非模态对话框两种。
实现方法为:
//创建模态你对话框
window.showModalDialog(sURL,vArguments,sFeatures)
//创建非模态对话框
window.showModelessDialog(sURL,vArguments,sFeatures)
其区别在于:
用showModelessDialog()打开窗口时,不必用window.close()去关闭它,当以非模态方式[IE5]打开时, 打开对话框
的窗口仍可以进行其他的操作,即对话框不总是最上面的焦点,当打开它的窗口URL改变时,它自动关闭。而模态[IE4]方式的对话框始终有焦点(焦点不可 移走,直到它关闭)。模态对话框和打开它的窗口相联系,因此我们打开另外的窗口时,他们的链接关系依然保存,并且隐藏在活动窗口的下面。 showModeDialog()则不然。
参数说明:
sURL:必选参数,类型:字符串。
用来指定对话框要显示的文档的URL。
vArguments:可选参数,类型:变体。
用来向对话框传递参数。传递的参数类型不限,包括数组等。对话框通过window.dialogArguments来取得传递进来的参数。
sFeatures:选参数,类型:字符串。
用来描述对话框的外观等信息,可以使用以下的一个或几个,用分号“;”隔开。
dialogHeight:对话框高度
不小于100px,IE4中dialogHeight和dialogWidth 默认的单位是em,而IE5中是px,为方便其见,在定义modal方式的对话框时,用px做单位。
dialogWidth: 对话框宽度。
dialogLeft: 距离桌面左的距离。
dialogTop: 离桌面上的距离。
center: 窗口是否居中
默认yes,但仍可以指定高度和宽度,取值范围{yes | no | 1 | 0 }。
help: 是否显示帮助按钮
默认yes,取值范围 {yes | no | 1 | 0 }。
resizable: 是否可被改变大小。
默认no,取值范围 {yes | no | 1 | 0 } [IE5+]。
status: 是否显示状态栏。
默认为yes[ Modeless]或no[Modal],
取值范围{yes | no | 1 | 0 } [IE5+]。
scroll:指明对话框是否显示滚动条。
默认为yes,取值范围{ yes | no | 1 | 0 | on | off }。
还有几个属性是用在HTA中的,在一般的网页中一般不使用。
dialogHide:在打印或者打印预览时对话框是否隐藏。
默认为no,取值范围{ yes | no | 1 | 0 | on | off }。
edge:指明对话框的边框样式。
默认为raised,取值范围{ sunken | raised }。
unadorned:默认为no,取值范围{ yes | no | 1 | 0 | on | off }。
传入参数:
要想对话框传递参数,是通过vArguments来进行传递的。类型不限制,对于字符串类型,最大为4096个字符。也可以传递对象
例如:
var newWin=window.showModalDialog(url,window,'dialogHeight:500px, dialogLeft:100px, dialogTop:100px,
dialogWidth:300px, status:0, edge:sunken');
newWin.open();
与使用window.open()方法创建窗口相比,模态方法创建窗口的区别在于有模态方法创建的窗口后将不能操作父窗口.
子窗口与父窗口间通信
(1) 使用window.open()创建的窗口与父窗口通信
可以在子窗口页面中通过window.opener来获取父窗口对象,获取之后子窗口便可以对父窗口执行刷新,传值等操作。
如:
window.opener.location.reload(); //子窗口刷新父窗口
window.opener.location.href //获取父窗口href
window.opener.locaiton.pathname //获取父窗口路径名
//刷新父页面
window.location.href=window.location.href ; //重新定位父页面
window.location.reload;
(2) 模态窗口与父窗口通信
通过使用showModelDialog(),及showModelessDialog()方法创建的子窗口想与父窗口通信时,不能通过window.opener
来获取父窗口对象。要实现通信,必须在创建模态子窗口时向子窗口传入父窗口对象。
实现方式为:
在父窗口中:
var newWin=window.showModelDialog(url,window,'');
newWin.open();
此时参数window即是父窗口对象
在子窗口中:
需首先获取父窗口对象,然后才能使用父窗口对象。由于父窗口对象是在创建
子窗口时通过传入参数的方式传入的,因此,在子窗口中也只能通过获取窗口参数的方式获取父窗口对象。获取方式如下
:
var parent=widnow.dialogArguments;
变量parent便是父窗口对象。
例如:
//通过子窗口提交父窗口中的表单:form1,提交后执行查询操作
var parent=window.dialogArguments;
parent.document.form1.action="QueryInfor.jsp";
parent.submit();
//刷新父页面
var parent=window.dialogArguments;
parent.location.reload();
//从子窗口传值到父窗口
要实现在模态子窗口中传值到父窗口,需要使用window.returnValue完成
实现方法如下:
在子窗口中:
//获取父窗口某字段值,对该值加一后返回父窗口
var parent=window.dialogArguments;
var x=parent.docuement.getElementById("age").value;
x=x+1;
//传回x值
window.returnValue=x;
在父窗口中:
//获取来自子窗口的值
var newWin=window.showModelDialog(url,window,'');
if(newWin!=null)
document.getElementById("age").value=newWin;
//在子窗口中设置父窗口的值
在子窗口中向父窗口中传入值似乎没有直接设置父窗口中的值来得明了。直接设置父窗口中元素的值显得要更灵活一些,不过具体使用哪种方法要根据实际情况和已 有的实现方式而定,因为如果使用了不切实际的方法不仅降低开发效率,也降低了执行效率,往往也会造成不优雅的实现方式和代码风格。
子窗口设置父窗口的值使用方法如下:
子窗口中:
var parent=window.dialogArguments;
var x=parent.document.getElementById("age").value;
x=x+1;
//设置父窗口中age属性值
parent.document.getElementById("age").value=x;
可以通过多种方式实现,下面介绍几种方法
(1) 通过window对象的open()方法,open()方法将会产生一个新的window窗口对象
其用法为:
window.open(URL,windowName,parameters);
URL: 描述要打开的窗口的URL地址,如何为空则不打开任何网页;
windowName:描述被打开的窗口的民称,可以使用'_top'、'_blank'等内建名称,这里的名称跟<a href="..." target="...">里的target属性是一样的。
parameters:描述被打开的窗口的参数值,或者说是样貌,其包括窗口的各个属性值,及要传入的参数值。
例如:
打开一个 400 x 100 的干净的窗口:
open('','_blank','width=400,height=100,menubar=no,toolbar=no,
location=no,directories=no,status=no,scrollbars=yes,resizable=yes')
也可以这样写: var newWindow = open('','_blank');
参数说明如下:
top=# 窗口顶部离开屏幕顶部的像素数
left=# 窗口左端离开屏幕左端的像素数
width=# 窗口的宽度
height=# 窗口的高度
menubar=... 窗口有没有菜单,取值yes或no
toolbar=... 窗口有没有工具条,取值yes或no
location=... 窗口有没有地址栏,取值yes或no
directories=... 窗口有没有连接区,取值yes或no
scrollbars=... 窗口有没有滚动条,取值yes或no
status=... 窗口有没有状态栏,取值yes或no
resizable=... 窗口给不给调整大小,取值yes或no
(2) 在javascript中除了通过open()方法建立window对象实现弹出窗口外,还可以通过建立对话框的方式弹出窗口。
如:
alert(""); //弹出信息提示对话框
confirm(""); //弹出信息确认对话框
prompt(""); //具有交互性质的对话框
但是,上述实现的弹出窗口具有的功能较为单一,只能完成较为简单的功能。对于需要在对话框中显示多个数据信息,
甚至是HTML控件就无能为力了。
(3) 使用模态对话框实现复杂的对话框需求
在javascript的内建方法中还有一类方法可以实现通过对话框显示HTML内容,
也就是说可以通过创建对话框的方式来完成创建窗口对象所能完成的功能。
包括创建模态对话框和非模态对话框两种。
实现方法为:
//创建模态你对话框
window.showModalDialog(sURL,vArguments,sFeatures)
//创建非模态对话框
window.showModelessDialog(sURL,vArguments,sFeatures)
其区别在于:
用showModelessDialog()打开窗口时,不必用window.close()去关闭它,当以非模态方式[IE5]打开时, 打开对话框
的窗口仍可以进行其他的操作,即对话框不总是最上面的焦点,当打开它的窗口URL改变时,它自动关闭。而模态[IE4]方式的对话框始终有焦点(焦点不可 移走,直到它关闭)。模态对话框和打开它的窗口相联系,因此我们打开另外的窗口时,他们的链接关系依然保存,并且隐藏在活动窗口的下面。 showModeDialog()则不然。
参数说明:
sURL:必选参数,类型:字符串。
用来指定对话框要显示的文档的URL。
vArguments:可选参数,类型:变体。
用来向对话框传递参数。传递的参数类型不限,包括数组等。对话框通过window.dialogArguments来取得传递进来的参数。
sFeatures:选参数,类型:字符串。
用来描述对话框的外观等信息,可以使用以下的一个或几个,用分号“;”隔开。
dialogHeight:对话框高度
不小于100px,IE4中dialogHeight和dialogWidth 默认的单位是em,而IE5中是px,为方便其见,在定义modal方式的对话框时,用px做单位。
dialogWidth: 对话框宽度。
dialogLeft: 距离桌面左的距离。
dialogTop: 离桌面上的距离。
center: 窗口是否居中
默认yes,但仍可以指定高度和宽度,取值范围{yes | no | 1 | 0 }。
help: 是否显示帮助按钮
默认yes,取值范围 {yes | no | 1 | 0 }。
resizable: 是否可被改变大小。
默认no,取值范围 {yes | no | 1 | 0 } [IE5+]。
status: 是否显示状态栏。
默认为yes[ Modeless]或no[Modal],
取值范围{yes | no | 1 | 0 } [IE5+]。
scroll:指明对话框是否显示滚动条。
默认为yes,取值范围{ yes | no | 1 | 0 | on | off }。
还有几个属性是用在HTA中的,在一般的网页中一般不使用。
dialogHide:在打印或者打印预览时对话框是否隐藏。
默认为no,取值范围{ yes | no | 1 | 0 | on | off }。
edge:指明对话框的边框样式。
默认为raised,取值范围{ sunken | raised }。
unadorned:默认为no,取值范围{ yes | no | 1 | 0 | on | off }。
传入参数:
要想对话框传递参数,是通过vArguments来进行传递的。类型不限制,对于字符串类型,最大为4096个字符。也可以传递对象
例如:
var newWin=window.showModalDialog(url,window,'dialogHeight:500px, dialogLeft:100px, dialogTop:100px,
dialogWidth:300px, status:0, edge:sunken');
newWin.open();
与使用window.open()方法创建窗口相比,模态方法创建窗口的区别在于有模态方法创建的窗口后将不能操作父窗口.
子窗口与父窗口间通信
(1) 使用window.open()创建的窗口与父窗口通信
可以在子窗口页面中通过window.opener来获取父窗口对象,获取之后子窗口便可以对父窗口执行刷新,传值等操作。
如:
window.opener.location.reload(); //子窗口刷新父窗口
window.opener.location.href //获取父窗口href
window.opener.locaiton.pathname //获取父窗口路径名
//刷新父页面
window.location.href=window.location.href ; //重新定位父页面
window.location.reload;
(2) 模态窗口与父窗口通信
通过使用showModelDialog(),及showModelessDialog()方法创建的子窗口想与父窗口通信时,不能通过window.opener
来获取父窗口对象。要实现通信,必须在创建模态子窗口时向子窗口传入父窗口对象。
实现方式为:
在父窗口中:
var newWin=window.showModelDialog(url,window,'');
newWin.open();
此时参数window即是父窗口对象
在子窗口中:
需首先获取父窗口对象,然后才能使用父窗口对象。由于父窗口对象是在创建
子窗口时通过传入参数的方式传入的,因此,在子窗口中也只能通过获取窗口参数的方式获取父窗口对象。获取方式如下
:
var parent=widnow.dialogArguments;
变量parent便是父窗口对象。
例如:
//通过子窗口提交父窗口中的表单:form1,提交后执行查询操作
var parent=window.dialogArguments;
parent.document.form1.action="QueryInfor.jsp";
parent.submit();
//刷新父页面
var parent=window.dialogArguments;
parent.location.reload();
//从子窗口传值到父窗口
要实现在模态子窗口中传值到父窗口,需要使用window.returnValue完成
实现方法如下:
在子窗口中:
//获取父窗口某字段值,对该值加一后返回父窗口
var parent=window.dialogArguments;
var x=parent.docuement.getElementById("age").value;
x=x+1;
//传回x值
window.returnValue=x;
在父窗口中:
//获取来自子窗口的值
var newWin=window.showModelDialog(url,window,'');
if(newWin!=null)
document.getElementById("age").value=newWin;
//在子窗口中设置父窗口的值
在子窗口中向父窗口中传入值似乎没有直接设置父窗口中的值来得明了。直接设置父窗口中元素的值显得要更灵活一些,不过具体使用哪种方法要根据实际情况和已 有的实现方式而定,因为如果使用了不切实际的方法不仅降低开发效率,也降低了执行效率,往往也会造成不优雅的实现方式和代码风格。
子窗口设置父窗口的值使用方法如下:
子窗口中:
var parent=window.dialogArguments;
var x=parent.document.getElementById("age").value;
x=x+1;
//设置父窗口中age属性值
parent.document.getElementById("age").value=x;
作者:
houfeng
出处:http://houfeng.cnblogs.com
本文版权归作者和博客园共有,未经作者同意请保留此声明.
发表评论
-
202060914
2020-06-09 14:44 0INSERT INTO `QMPARAMDETAIL` (` ... -
20200609
2020-06-09 14:42 0INSERT INTO `QMPARAMDETAIL` (` ... -
shengxiao
2020-06-03 21:37 0生肖 原则 部首 举例 吉凶 ... -
wuge
2020-04-28 14:55 0INSERT INTO `QMPARAM` (`TYPE`, ... -
wugesancai
2020-04-28 14:53 0INSERT INTO `QMPARAM` (`TYPE`, ... -
js监控页面加载完成后执行action
2012-12-08 20:34 3117//Some scripts require that you ... -
JS 判断 null 转
2012-09-25 18:45 1281... -
js子窗口和父窗口交互 转
2012-09-20 18:44 20301。父窗口传递信息给子窗口 看代码实例: ... -
[转载]jquery获取父窗口的元素
2012-09-20 18:36 1840window.parent.document.getEleme ... -
父窗口和子窗口之间的交互 转
2012-09-20 18:26 2040转自:http://hi.baidu.com/gfan ... -
TagSupport与BodyTagSupport的区别
2012-09-18 10:29 8597标签库的接口和类的继承关系 答:表现形式一: a ... -
JSP传参数给Birt的两种方法 转
2012-09-06 20:01 9870JSP传参数给Birt ... -
Birt学习笔记——birt开发过程中常见的问题 (转)
2012-09-04 15:36 86592011-11-02 00:06:42| 分类: ... -
正则表达式语法
2012-08-28 16:28 1036一个正则表达式就是由普通字符(例如字符 a 到 z)以及 ... -
jquery 操作 radio checkbox select 等表单 总结 (单选、复选、下拉框)
2012-07-14 18:47 2050转载:http://tiame.iteye.com/blog/ ... -
CSS3.0 的介绍 CSS3的介绍
2011-10-27 11:31 1498CSS3中新技术:圆角、个 ... -
HTML5 详细介绍 及应用实例
2011-10-27 10:58 2026HTML5 概况 什么是 HTML5 H ... -
JavaScript Call 方法和 JavaScript Apply方法 总结
2011-10-26 11:23 1761Javascript的每个Function对象中 ... -
javascript 的保留字 Javascript未来保留字(Javascript Future Reserved Words)
2011-10-26 10:05 1216以下的保留字不可 ... -
JavaScript闭包的详细解释 深入理解javascript闭包
2011-10-26 08:04 1899javascript闭包(Closure)初探 clos ...
相关推荐
使用VS2015写的MFC子窗口与父窗口之间消息的传递,可以直接执行
WPF父子窗体传输示例,父窗体向子窗体传参。子窗体回传参数到父窗体。 WPF showdialog模式。
pyqt父子窗口相互传值 pyqt信号槽的使用 对新手可能有帮助
qt 工程文件 实现父子窗口之间的切换 主要步骤如下: 1.在子窗口的cpp源文件中(childwindow.cpp),声明一个自定义信号(void mysignal()) 和 一个用于发送自定义信号的自定义槽函数( void sendMysignal() )。 2.在...
NULL 博文链接:https://phpxiaoxin.iteye.com/blog/423340
Qt主窗口与子窗口之间相互传值,对新手有帮助。
父子进程之间的共享内存,父子之间的互相通信。
2、 编写一段程序,使用管道实现父子进程之间的通信 a) 使用系统调用fork()创建一个子进程 b) 子进程调用函数write()向父进程发送自己的进程ID和字符串” s sending a message to parent.\n”。 c) 父进程调用函数...
NULL 博文链接:https://ap0406708.iteye.com/blog/543734
摘要:Java源码,窗体界面,父窗口,子窗口 Java 的swing 组件创建父子窗口的例子,使用的结构是JDesktopPane-JInternalFrame。JDesktopPane 相当于一个“父窗口”,可以拥有多个作为“子窗口”的JInternalFrame 对象。...
主要介绍了vue实现父子组件之间的通信以及兄弟组件的通信功能,结合实例形式分析了vue.js组件间通信相关操作技巧,需要的朋友可以参考下
父子窗体设计的简单示例,不过很实用的哦,点击左边的树形结构右边显示相应的子窗体
主要介绍了js操作模态窗口及父子窗口间相互传值,需要的朋友可以参考下
delphi开发MDI多窗口程序(office word那种父子窗口).zip
父子窗体的调用,代码很少,()()()()
UNIX下C语言实现父子进程通信,通过管道实现
MFC下完成子窗口与父窗口之间的额数据传递
该案例实现的是多个子窗口在父级窗口中自适应显示,使用的软件版本vs2010,希望这个案列可以帮助到到大家
qt使用QProcess实现父子进程通信