Window.Open参数、返回值
一、window.open()支持环境：
JavaScript1.0+/JScript1.0+/Nav2+/IE3+/Opera3+
二、基本语法：
window.open(pageURL,name,parameters)
其中：
pageURL为子窗口路径
name为子窗口句柄
parameters为窗口参数(各参数用逗号分隔)
三、示例：
<SCRIPT>
<!--
window.open('page.html','newwindow','height=100,width=400,top=0,left=0,toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,status=no')
//写成一行
-->
</SCRIPT>
脚本运行后，page.html将在新窗体newwindow中打开，宽为100，高为400，距屏顶0象素，屏左0象素，无工具条，无菜单条，无滚动条，不可调整大小，无地址栏，无状态栏。请对照。
上例中涉及的为常用的几个参数，除此以外还有很多其他参数，请见四。四、各项参数
其中yes/no也可使用1/0；pixelvalue为具体的数值，单位象素。
参数|取值范围|说明
alwaysLowered|yes/no|指定窗口隐藏在所有窗口之后
alwaysRaised|yes/no|指定窗口悬浮在所有窗口之上
depended|yes/no|是否和父窗口同时关闭
directories|yes/no|Nav2和3的目录栏是否可见
height|pixelvalue|窗口高度
hotkeys|yes/no|在没菜单栏的窗口中设安全退出热键
innerHeight|pixelvalue|窗口中文档的像素高度
innerWidth|pixelvalue|窗口中文档的像素宽度
location|yes/no|位置栏是否可见
menubar|yes/no|菜单栏是否可见
outerHeight|pixelvalue|设定窗口(包括装饰边框)的像素高度
outerWidth|pixelvalue|设定窗口(包括装饰边框)的像素宽度
resizable|yes/no|窗口大小是否可调整
screenX|pixelvalue|窗口距屏幕左边界的像素长度
screenY|pixelvalue|窗口距屏幕上边界的像素长度
scrollbars|yes/no|窗口是否可有滚动栏
titlebar|yes/no|窗口题目栏是否可见
toolbar|yes/no|窗口工具栏是否可见
Width|pixelvalue|窗口的像素宽度
z-look|yes/no|窗口被激活后是否浮在其它窗口之上
【1、最基本的弹出窗口代码】
其实代码非常简单：<SCRIPTLANGUAGE="javascript">
<!--
window.open('page.html')
-->
</SCRIPT因为着是一段javascripts代码，所以它们应该放在<SCRIPTLANGUAGE="javascript">标签和</script>之间。<!--和-->是对一些版本低的浏览器起作用，在这些老浏览器中不会将标签中的代码作为文本显示出来。要养成这个好习惯啊。
Window.open('page.html')用于控制弹出新的窗口page.html，如果page.html不与主窗口在同一路径下，前面应写明路径，绝对路径(http://)和相对路径(../)均可。用单引号和双引号都可以，只是不要混用。
这一段代码可以加入HTML的任意位置，<head>和</head>之间可以，<body>间</body>也可以，越前越早执行，尤其是页面代码长，又想使页面早点弹出就尽量往前放。
【2、经过设置后的弹出窗口】
下面再说一说弹出窗口的设置。只要再往上面的代码中加一点东西就可以了。
我们来定制这个弹出的窗口的外观，尺寸大小，弹出的位置以适应该页面的具体情况。<SCRIPTLANGUAGE="javascript">
<!--
window.open('page.html','newwindow','height=100,width=400,top=0,left=0,toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,status=no')
//写成一行
-->
</SCRIPT>参数解释：
<SCRIPTLANGUAGE="javascript">js脚本开始；
window.open弹出新窗口的命令；
'page.html'弹出窗口的文件名；
'newwindow'弹出窗口的名字（不是文件名），非必须，可用空''代替；
height=100窗口高度；
width=400窗口宽度；
top=0窗口距离屏幕上方的象素值；
left=0窗口距离屏幕左侧的象素值；
toolbar=no是否显示工具栏，yes为显示；
menubar，scrollbars表示菜单栏和滚动栏。
Resizable=no是否允许改变窗口大小，yes为允许；
location=no是否显示地址栏，yes为允许；
status=no是否显示状态栏内的信息（通常是文件已经打开），yes为允许；
</SCRIPT>js脚本结束
【3、用函数控制弹出窗口】<html>
下面是一个完整的代码
<head>
<scriptLANGUAGE="JavaScript">
<!--
functionopenwin(){window.open("page.html","newwindow","height=100,width=400,toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,status=no")
//写成一行
}
//-->
</script>
</head>
<bodyonload="openwin()">
…任意的页面内容…
</body>
</html>
这里定义了一个函数openwin(),函数内容就是打开一个窗口。在调用它之前没有任何用途。
怎么调用呢？
方法一：<bodyonload="openwin()">浏览器读页面时弹出窗口；
方法二：<bodyonunload="openwin()">浏览器离开页面时弹出窗口；
方法三：用一个连接调用：
<ahref="#"onclick="openwin()">打开一个窗口</a>
注意：使用的"#"是虚连接。
方法四：用一个按钮调用：
<inputtype="button"onclick="openwin()"value="打开窗口">
【4、同时弹出2个窗口】
对源代码稍微改动一下：
<scriptLANGUAGE="JavaScript">
<!--
functionopenwin()
{window.open("page.html","newwindow","height=100,width=100,top=0,left=0,toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,status=no")
//写成一行
window.open("page2.html","newwindow2","height=100,width=100,top=100,left=100,toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,status=no")
//写成一行
}
//-->
</script>
为避免弹出的2个窗口覆盖，用top和left控制一下弹出的位置不要相互覆盖即可。最后用上面说过的四种方法调用即可。
注意：2个窗口的name(newwindows和newwindow2)不要相同，或者干脆全部为空。OK？
【5、主窗口打开文件1.htm，同时弹出小窗口page.html】
如下代码加入主窗口<head>区：
<scriptlanguage="javascript">
<!--
functionopenwin()
{window.open("page.html","","width=200,height=200")
}
//-->
</script>
加入<body>区：
<ahref="1.htm"onclick="openwin()">open</a>即可。
【6、弹出的窗口之定时关闭控制】
下面我们再对弹出的窗口进行一些控制，效果就更好了。如果我们再将一小段代码加入弹出的页面(注意是加入到page.html的HTML中，可不是主页面中，否则…)，让它10秒后自动关闭是不是更酷了？
首先，将如下代码加入page.html文件的<head>区：
<scriptlanguage="JavaScript">
functioncloseit()
{setTimeout("self.close()",10000)//毫秒}
</script>
然后，再用<bodyonload="closeit()">这一句话代替page.html中原有的<BODY>这一句就可以了。(这一句话千万不要忘记写啊！这一句的作用是调用关闭窗口的代码，10秒钟后就自行关闭该窗口。)
【7、在弹出窗口中加上一个关闭按钮】
<FORM>
<INPUTTYPE='BUTTON'VALUE='关闭'onClick='window.close()'>
</FORM>
呵呵，现在更加完美了！
【8、内包含的弹出窗口-一个页面两个窗口】
上面的例子都包含两个窗口，一个是主窗口，另一个是弹出的小窗口。
通过下面的例子，你可以在一个页面内完成上面的效果。
<html>
<head>
<SCRIPTLANGUAGE="JavaScript">
functionopenwin()
{OpenWindow=window.open("","newwin","height=250,width=250,toolbar=no,scrollbars="+scroll+",menubar=no");
//写成一行
OpenWindow.document.write("<TITLE>例子</TITLE>")
OpenWindow.document.write("<BODYBGCOLOR=#ffffff>")
OpenWindow.document.write("<h1>Hello!</h1>")
OpenWindow.document.write("Newwindowopened!")
OpenWindow.document.write("</BODY>")
OpenWindow.document.write("</HTML>")
OpenWindow.document.close()}
</SCRIPT>
</head>
<body>
<ahref="#"onclick="openwin()">打开一个窗口</a>
<inputtype="button"onclick="openwin()"value="打开窗口">
</body>
</html>
看看OpenWindow.document.write()里面的代码不就是标准的HTML吗？只要按照格式写更多的行即可。千万注意多一个标签或少一个标签就会出现错误。记得用OpenWindow.document.close()结束啊。
【9、终极应用--弹出的窗口之Cookie控制】
回想一下，上面的弹出窗口虽然酷，但是有一点小毛病(沉浸在喜悦之中，一定没有发现吧？)比如你将上面的脚本放在一个需要频繁经过的页面里(例如首页)，那么每次刷新这个页面，窗口都会弹出一次，是不是非常烦人？:-(有解决的办法吗？Yes!;-)Followme.
我们使用cookie来控制一下就可以了。
首先，将如下代码加入主页面HTML的<HEAD>区：
<script>
functionopenwin()
{window.open("page.html","","width=200,height=200")}
functionget_cookie(Name)
{varsearch=Name+"="
varreturnvalue="";
if(document.cookie.length>0){
offset=document.cookie.indexOf(search)
if(offset!=-1){
offset+=search.length
end=document.cookie.indexOf(";",offset);
if(end==-1)
end=document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset,end))
}
}
returnreturnvalue;
}
functionloadpopup(){
if(get_cookie('popped')==''){
openwin()
document.cookie="popped=yes"
}
}
</script>
然后，用<bodyonload="loadpopup()">（注意不是openwin而是loadpop啊！）替换主页面中原有的<BODY>这一句即可。你可以试着刷新一下这个页面或重新进入该页面，窗口再也不会弹出了。真正的Pop-Only-Once！
写到这里弹出窗口的制作和应用技巧基本上算是完成了，俺也累坏了，一口气说了这么多，希望对正在制作网页的朋友有所帮助俺就非常欣慰了。
需要注意的是，JS脚本中的的大小写最好前后保持一致。
【10、关闭弹出窗口时候刷新父窗体】
引用下面的JS方法，实现关闭弹出窗口刷新父窗体
javascript:opener.location.href=opener.location.href;opener=null;window.close()
Window.Open参数、返回值的更多相关文章
- SubSonic3.0使用存储过程查询时，不能使用output参数返回值的问题修改
有个群友问SubSonic3.0执行存储过程时能不能使用output参数返回值,说测试过后获取不到返回值,早上有些时间所以就尝试修改了一下 首先在数据库中创建一个存储过程 CREATE PROCEDU ...
- ajaxFileUpload上传带参数,返回值改成json格式
/*直接复制在自己的js文件中就能使用*/ jQuery.extend({ createUploadIframe: function (id, uri) { //create frame var fr ...
- Swift 定义函数 参数 返回值
定义多参数函数 - 用func声明函数 func name(parameters) -> return type { function body } func halfOpenRangeLen ...
- 自定义函数中的参数返回值 “-> (Int -> Int)”的问题
func makeIncrementer() -> (Int -> Int) { func addOne(number: Int) -> Int { + number } retur ...
- [Day14]Eclipse高级、类与接口作为参数返回值
l 不同修饰符的使用 类,最常使用public修饰 成员变量,最常使用private修饰 成员方法,最常使用public修饰 l 自定义数据类型的使用 类作为方法参数时,说明要向方 ...
- Java面向对象（Eclipse高级、类与接口作为参数返回值）
面向对象 今日内容介绍 u Eclipse常用快捷键操作 u Eclipse文档注释导出帮助文档 u Eclipse项目的jar包导出与使用jar包 u 不同修饰符混合使用细节 u 辨析何时定义变 ...
- 14_Java面向对象_第14天（Eclipse高级、类与接口作为参数返回值）_讲义
今日内容介绍 1.Eclipse常用快捷键操作 2.Eclipse文档注释导出帮助文档 3.Eclipse项目的jar包导出与使用jar包 4.不同修饰符混合使用细节 5.辨析何时定义变量为成员变量 ...
- 14_java之变量|参数|返回值|修饰符
01java中的文档注释和制作 * A: 在eclipse使用时,可以配合文档注释,导出对类的说明文档,从而供其 他人阅读学习与使用. 通过使用文档注释,将类或者方法进行注释用@简单标注基本信息.如@ ...
- python函数基础-参数-返回值-注释-01
什么是函数 函数就是有特定功能的工具 # python中有内置函数(python解释器预先封装好的)与自定义函数(用户自定义封装的)之分 为什么要用函数 # 可以减少代码冗余,增加代码复用性 # 使代 ...
- python函数1_参数,返回值和嵌套
函数 将重复的代码,封装到函数,只要使用直接找函数 函数可以增强代码的模块化和提高代码的重复利用率 函数的定义和调用 格式 def 函数名([参数,参数...]): 函数体 定义函数 import r ...
随机推荐
- ionic 中使用ion-slide-box
ion-slide-box 用法: <ion-slide-box class="slide" auto-play="true" does-continue ...
- hdu-5586 Sum(dp)
题目链接: Sum Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/Others) Probl ...
- 说一说Android的工程目录结构
这段时间正在学习有关Android的知识,对在Eclipse下开发的Android项目的目录结构有了一定的了解,在此对目录结构做一个简单的介绍.下图是在Eclipse下Android项目展开的项目目录 ...
- 使用vhd灌装系统——测试系统专用
需要使用工具imagex.exe 一. 创建虚拟磁盘: 1.diskpart 2.create vdisk file=c:\test\leiyue.vhd maximum=20000 [tpye=ex ...
- Cocos2d-JS动画
与动作密不可分的还有动画,动画又可以分为场景过渡动画和帧动画.场景过渡动画我们在以往介绍过,这一个我们只介绍帧动画.帧动画帧动画就是按一定时间间隔.一定的顺序.一帧一帧地显示帧图片.我们的美工要为精灵 ...
- NSString和NSArray平时练习总结
/*************************字符串练习****************************/ //创建字符串 //1.快速创建 NSString *str1 = @&quo ...
- eclipse安装tomcate插件步骤
今天在网上看了很多关于eclipse需要安装tomcat的文章,小编也没有指责的意思,只是想说为什么有那么多雷同且不正确的搭建过程,真是ctrl+c, ctrl+v玩多了吧,不知道流程有的是错误的,不 ...
- php面向对象的基础
这是第一次写博客,希望大家多多支持! 一.OOP概念 1.类(class) 它包括名称.方法.属性和事件.实际是它本身不是对象,因为它不存在内存中.当引用类的代码运行时,类的一个新的实例,及对象,就在 ...
- web前端炫酷实用的HTML5应用和jQuery插件
又开始了新的一天,我们也将继续为大家分享许多优秀的HTML5应用和jQuery插件,作为前端开发者来说,这些资源可以帮助你在项目开发上派上用场.下面一起来看看这些炫酷而实用的HTML5应用和jQuer ...
- 杭电ACM2091--空心三角形
http://acm.hdu.edu.cn/showproblem.php?pid=2091 scanf 和 printf的输入输出功能并不强大.有时候我们需要清空输入输出流,所以一定切记getcha ...