控制IE的弹出页面
最基本的弹出窗口是通过windowopen()方法来实现的读者对下面这段代码应该不陌生执行该方法将会在浏览器中打开一个新的indexhtml页面
<script LANGUAGE=javascript>
windowopen (indexhtml)
</script>
节提到过JavaScript代码在HTML中的嵌入形式所以应该放在<script LANGUAGE =javascript>标记和</script>之间windowopen(indexhtml)的作用是打开一个新窗口并装载URL指定的文档如果没指定URL将会装载一个空白文档
注意如果载入的文件与主窗口不在同一路径下前面应写明路径绝对路径(http://)或相对路径(/)均可可以用单引号也可以用双引号只是要注意符号统一
通过改变windowopen()的参数来弹出窗口
通过改变windowopen()函数中的参数可以对弹出窗口的外观进行具体的设置例如弹出窗口的外观尺寸大小弹出位置等
<script LANGUAGE=javascript>
<!
windowopen(indexhtmlnewwindowheight=
width=top=left=toolbar=nomenubar=no
scrollbars=no resizable=nolocation=nostatus=no)
//注意写在一行
>
</script>
【参数解释】
<script LANGUAGE=java script>:JavaScript开始标记
windowopen:弹出新窗口的命令
pagehtml:弹出新窗口的文件名
newwindow:弹出窗口的名字(不是文件名)可用空代替
height=:窗口高度
top=:窗口距离屏幕上方的像素值
left=:窗口距离屏幕左侧的像素值
toolbar=no:是否显示工具栏yes为显示
menubarscrollbars:表示菜单栏和滚动栏
resizable=no:是否允许改变窗口大小yes为允许
location=no:是否显示地址栏yes为允许
status=no:是否显示状态栏内的信息(通常是文件已经打开)yes为允许
</script>:JavaScript结束标记
通过封装函数调用的方式来控制弹出窗口
除了直接在HTML代码中插入JavaScript脚本外还可以通过封装函数调用的方式来控制弹出窗口下面是一段完整的应用
<html>
<head>
<script LANGUAGE=javascript>
<!
function openwin (){
windowopen(indexhtmlnewwindowheight=width=toolbar=no
menubar=noscrollbars=no resizable=nolocation=nostatus=no;)
//注意折行问题
}
>
</script>
</head>
<body onload=opennew ()>
<! HTML页面内容 >
</body>
</html>
【代码解读】
以上代码将打开一个新的弹出窗口将业务逻辑代码进行函数封装并命名为opennew()需要注意的是封装的函数在没有被调用之前是不会被执行的这样在实际的应用中就可以根据不同的需求选择不同的调用方式最常用的方法有以下几种
直接加载<body onload=opennew ()>即直接加载方式当浏览器执行到该行代码后调用弹出窗口函数
离开调用<body onunload=opennew ()> 即当浏览器离开本次浏览的页面时调用弹出窗口函数
伪链接调用<a href=# onclick= opennew ()>被打开文件名</a>即通过onclick单击事件来调用弹出窗口函数
注意使用的#符号代表空链接
按钮调用<input type=button onclick=opennew () value=打开窗口>同链接调用的原理相同即通过onclick点击事件来调用弹出窗口函数
下面通过一个完整的例子展示用以上种方法调用弹出窗口实例在浏览器中的执行效果如图所示调用后的效果如图所示
<html>
<head>
<meta httpequiv=ContentType content=text/html; charset=utf />
<title>弹出窗口页面设置例子</title>
<script LANGUAGE=Javascript>
function newopen() {
var newopen ;
newopen=windowopen (indexhtml newwindow height= width=
toolbar =no menubar=no scrollbars=no resizable=no location=no
status=no) //写成一行
newopendocumentwrite(<TITLE>弹出窗口页面设置例子</TITLE>)
newopendocumentwrite(<BODY BGCOLOR=#FFFFFF>)
newopendocumentwrite(<H>Hello!</h>)
newopendocumentwrite(New window opened!)
newopendocumentwrite(</BODY >)
newopendocumentwrite(</HTML>)
newopendocumentclose()
}
</script>
<meta httpequiv=ContentType content=text/html; charset=utf>
</head>
<!注释<body onload=newopen()>>
<!注释<body onunload=newopen()>>
<body>
直接加载方式>在代码中去掉注释<br/>
离开加载方式>在代码中去掉注释<br/>
链接触发调用><a href=# onClick=newopen()>链接方式打开</a><br/>
按钮触发调用><input type=button onClick=newopen() value=按钮调用>
</body>
</html>
代码在浏览器中的执行效果如图所示调用后的效果如图所示
图 弹出窗口预览
返回目录PHP典型模块与项目实战大全
编辑推荐
Java Web开发详解
PHP Web开发学习实录
ASP NET开发培训视频教程
图 调用弹出页面