JSP弹出窗口和形式对话框[宝典]
JSP弹出窗口和模式对话框
关键字:,,,,,常见弹出窗口和模式对话框的介绍
,,,,,本文转载于其它blog,在此向本文原创者,致意~
,,,,,JSP,,,,,弹出窗口
,,,,,一、window.open(),,,,,基础知识
,,,,,1、window.open()支持环境: ,,,,,JavaScript1.0+/JScript1.0+/Nav2+/IE3+/Opera3+
,,,,,2、基本语法:window.open(pageURL,name,parameters)
,,,,,其中:
,,,,,pageURL,,,,,为子窗口路径
,,,,,name,,,,,为子窗口句柄
,,,,,parameters,,,,,为窗口参数(各参数用逗号分隔)
,,,,,3、简单示例:
,,,,,脚本运行后,page.aspx将在新窗体newwindow中打开,宽为100,高为400,距屏顶0象素,屏左0象素,无工具条,无菜单条,无滚动条,不可调整大小,无地址栏,无状态栏。其中是对一些版本低的浏览器起作用,在这些低版本浏览器中不会将标签中的代码作为文本显示出来,要养成这个好习惯。
,,,,,4、可用的parameters:其中yes/no也可使用1/0;pixel,,,,,value为具体的数值,单位象素。
,,,,,参数 ,,,,,| ,,,,,取值范围 ,,,,,| ,,,,,说明
alwaysLowered ,,,,,| ,,,,,yes/no ,,,,,| ,,,,,指定窗口隐藏在所有窗口之后
,,,,,alwaysRaised ,,,,,| ,,,,,yes/no ,,,,,| ,,,,,指定窗口悬浮在所有窗口之上
,,,,,depended ,,,,,| ,,,,,yes/no ,,,,,| ,,,,,是否和父窗口同时关闭
,,,,,directories ,,,,,| ,,,,,yes/no ,,,,,| ,,,,,Nav2和3的目录栏是否可见
,,,,,height ,,,,,| ,,,,,pixel,,,,,value ,,,,,| ,,,,,窗口高度
,,,,,hotkeys ,,,,,| ,,,,,yes/no ,,,,,| ,,,,,在没菜单栏的窗口中设安全退出热键
,,,,,innerHeight ,,,,,| ,,,,,pixel,,,,,value ,,,,,| ,,,,,窗口中文档的像素高度
,,,,,innerWidth ,,,,,| ,,,,,pixel,,,,,value ,,,,,| ,,,,,窗口中文档的像素宽度
,,,,,location ,,,,,| ,,,,,yes/no ,,,,,| ,,,,,位置栏是否可见
,,,,,menubar ,,,,,| ,,,,,yes/no ,,,,,| ,,,,,菜单栏是否可见
,,,,,outerHeight ,,,,,| ,,,,,pixel,,,,,value ,,,,,| ,,,,,设定窗口(包括装饰边框)的像素高度
,,,,,outerWidth ,,,,,| ,,,,,pixel,,,,,value ,,,,,| ,,,,,设定窗口(包括装饰边框)的像素宽度
,,,,,resizable ,,,,,| ,,,,,yes/no ,,,,,| ,,,,,窗口大小是否可调整
,,,,,screenX ,,,,,| ,,,,,pixel,,,,,value ,,,,,| ,,,,,窗口距屏幕左边界的像素长度
,,,,,screenY ,,,,,| ,,,,,pixel,,,,,value ,,,,,| ,,,,,窗口距屏幕上边界的像素长度
,,,,,scrollbars ,,,,,| ,,,,,yes/no ,,,,,| ,,,,,窗口是否可有滚动栏
,,,,,status ,,,,,| ,,,,,yes/no ,,,,,| ,,,,,是否显示状态栏内的信息
,,,,,titlebar ,,,,,| ,,,,,yes/no ,,,,,| ,,,,,窗口题目栏是否可见
,,,,,toolbar ,,,,,| ,,,,,yes/no ,,,,,| ,,,,,窗口工具栏是否可见
,,,,,Width ,,,,,|,,,,,pixel,,,,,value ,,,,,| ,,,,,窗口的像素宽度
,,,,,z-look ,,,,,| ,,,,,yes/no ,,,,,| ,,,,,窗口被激活后是否浮在其它窗口之上
,,,,,二、window.open(),,,,,应用与技巧
,,,,,1.用一个连接调用
打开一个窗口 *使用的“#”是虚连接,若把“#”换成一个页面,则效果是:打开这个页面的同时弹出小窗口。
,,,,,2、定时关闭弹出窗口
,,,,,只需在窗口页面(注意是窗口页面)加入以下代码即可。
,,,,,其中,10000的单位是毫秒。再在变成即可。
,,,,,3、主窗口和弹出窗口处于一个页面
,,,,,一般,主窗口和弹出窗口都是分别为两个页面,可否都处在一个页面呢,当然是可以的。
,,,,,
无标题页
,,,,,
,,,,,
,,,,,4、经常的应用
//=====================================================================
=====
//
// ,,,,,代码描述:打开一个新的没有状态栏、工具栏、菜单栏、定位栏,
// ,,,,,不能改变大小,且位置居中的新窗口 //
// ,,,,,传入参数:pageURL,,,,,-,,,,,传递链接
// ,,,,,innerWidth,,,,,-,,,,,传递需要打开新窗口的宽度 // ,,,,,innerHeight,,,,,-,,,,,传递需要打开新窗口的高度 //
// ,,,,,返回参数:无
//
//
//==========================================================================
function,,,,,g_OpenWindow(pageURL,,,,,,innerWidth,,,,,,innerHeight)
{
,,,,,var,,,,,ScreenWidth,,,,,=,,,,,screen.availWidth
,,,,,var,,,,,ScreenHeight,,,,,=,,,,,screen.availHeight
,,,,,var,,,,,StartX,,,,,=,,,,,(ScreenWidth,,,,,-,,,,,innerWidth),,,,,/,,,,,2
,,,,,var,,,,,StartY,,,,,=,,,,,(ScreenHeight,,,,,-,,,,,innerHeight),,,,,/,,,,,2
,,,,,window.open(pageURL,,,,,,'',,,,,,'left='+,,,,,StartX,,,,,+,,,,,',,,,,,top='+,,,,,StartY,,,,,+,,,,,',,,,,,Wid
th=',,,,,+,,,,,innerWidth,,,,,+',,,,,,height=',,,,,+,,,,,innerHeight,,,,,+,,,,,',,,,,,resizable=no,,,,,,scrollbars=
yes,,,,,,status=no,,,,,,toolbar=no,,,,,,menubar=no,,,,,,location=no')
}
,,,,,三、模式窗口函数弹出窗口
//==========================================================================================
//
//,,,,,代码描述:打开模式窗口函数,打开一个模式窗口不包含菜单、状态条、工具条、定位
栏
//
//,,,,,传入参数:pageURL,,,,,-,,,,,传递链接
// ,,,,,innerWidth,,,,,-,,,,,传递需要打开新窗口的宽度
// ,,,,,innerHeight,,,,,-,,,,,传递需要打开新窗口的高度
//,,,,,返回参数:无
//
//
//==========================================================================================
function,,,,,g_OpenModalWindow(pageURL,,,,,,innerWidth,,,,,,innerHeight)
{
,,,,,window.showModalDialog(pageURL,,,,,,null,,,,,,'dialogWidth:',,,,,+,,,,,innerWidth,,,,,+,,,,,'px;
dialogHeight:',,,,,+,,,,,innerHeight,,,,,+,,,,,'px;help:no;unadorned:no;resizable:no;status:no')
}
//==========================================================================================
//
//,,,,,代码描述:打开模式窗口函数,打开一个模式窗口不包含菜单、状态条、工具条、定位
栏,,,,,,并且返回值
//
//,,,,,传入参数:pageURL,,,,,-,,,,,传递链接
// ,,,,,innerWidth,,,,,-,,,,,传递需要打开新窗口的宽度
// ,,,,,innerHeight,,,,,-,,,,,传递需要打开新窗口的高度
//,,,,,返回参数:模式窗体返回的returnValue
//
//
//==========================================================================================
function,,,,,g_OpenreturnWindow(pageURL,,,,,,innerWidth,,,,,,innerHeight)
{
,,,,,var,,,,,returnv;
,,,,,returnv=window.showModalDialog(pageURL,,,,,,null,,,,,,'dialogWidth:',,,,,+,,,,,innerWidth,,,,
,+,,,,,'px;dialogHeight:',,,,,+,,,,,innerHeight,,,,,+,,,,,'px;help:no;unadorned:no;resizable:no;status:no'
)
,,,,,return,,,,,returnv;
}
//==========================================================================================
//
//,,,,,代码描述:打开模式窗口函数,打开一个模式窗口不包含菜单、状态条、工具条、定位
栏
//
//,,,,,传入参数:pageURL,,,,,-,,,,,传递链接
// ,,,,,innerWidth,,,,,-,,,,,传递需要打开新窗口的宽度
// ,,,,,innerHeight,,,,,-,,,,,传递需要打开新窗口的高度
//,,,,,返回参数:无
//
//
//==========================================================================================
function,,,,,g_OpenReturnModalWindow(pageURL,,,,,,innerWidth,,,,,,innerHeight)
{
,,,,,window.showModalDialog(pageURL,,,,,,null,,,,,,'dialogWidth:',,,,,+,,,,,innerWidth,,,,,+,,,,,'px;
dialogHeight:',,,,,+,,,,,innerHeight,,,,,+,,,,,'px;help:no;unadorned:no;resizable:no;status:no');
,,,,,return,,,,,false;
}
2008-12-07
模式对话框父子窗口间的通信
文章分类:Web前端,,,,,关键字:,,,,,防止模式对话框弹出新的子窗口,,,,,
,,,,,本文主要对防止模式对话框弹出新子窗口,和父子窗口间的通信进行介绍。,,,,,
,,,,,比如,如下代码是子窗口(模式窗口)的jsp中的js代码。,,,,,
,,,,,function,,,,,test(),,,,,{,,,,,
var,,,,,flag,,,,,=,,,,,document.getElementById("key");,,,,,
if,,,,,(flag.value,,,,,==,,,,,"true"),,,,,{,,,,,
,,,,,window.returnValue,,,,,=,,,,,true;,,,,, window.close();,,,,,},,,,,
},,,,,
"key"是jsp页面中某标签的id,比如其可以是
,其中value1是action中的某个返回属性,当value1=true时,子窗口就向父窗口返回true并关闭该子窗口(调用window.close();).,,,,,
,,,,,上面光给出了子窗口中的js代码,下面给出子窗口中的jsp代码,比如jsp代码为:,,,,,
,,,,, ,,,,, ..............................,,,,,
,,,,,
,,,,,
上面
,,,,,
中的window.name=“heihei”;就是防止子窗口重新再另外打开一个子窗口的。
并且window.name="heihei"中的"heihei"要和单
中的target的值(”heihei“)相同,简而言之就是,每次打开的子窗口都是当前窗口,即是在target指定的窗口中打开。要实现在模态子窗口中传值到父窗口,需要使用window.returnValue完成,,,,,
,,,,,在父窗口中就可以得到该子窗口返回的值,其得到方式为:,,,,,
,,,,,var,,,,,newWin=window.showModelDialog(url,window,'');当上面的子窗口返回为ture是,父窗口中的值newWin的值就为true否则为false。函数window.showModelDialog(url,window,'')中的第一个参数可以是一个
action(比如:test.action或"test.shtml?page=1"),也可以是一个具体的
jsp(test.jsp)页面。,,,,,
,,,,,1.,,,,,在子窗口中:,,,,,
//获取父窗口某字段值,对该值加一后返回父窗口,,,,,
var,,,,,parent=window.dialogArguments;,,,,,
var,,,,,x=parent.docuement.getElementById("age").value;,,,,,
x=x+1;,,,,,
//传回x值,,,,,
window.returnValue=x;,,,,,
,,,,,2.在父窗口中:,,,,,
//获取来自子窗口的值,并把其赋给某个对象,,,,,
var,,,,,newWin=window.showModelDialog(url,window,'');,,,,,
if(newWin!=null),,,,,
document.getElementById("age").value=newWin;,,,,,
,,,,,3.子窗口设置父窗口的值使用方法如下:,,,,,
,,,,,子窗口中:,,,,,
//age是父窗口中的某标签对象的id,,,,,
var,,,,,parent=window.dialogArguments;,,,,,
var,,,,,x=parent.document.getElementById("age").value;,,,,,
x=x+1;,,,,,
//设置父窗口中age属性值,,,,,
parent.document.getElementById("age").value=x;,,,,,
走笔至此~,,,,,