订阅本栏目 RSS您所在的位置: 深山工作室 > HTML > 正文

初学入门:一组常用的弹出窗口用法总结

赛迪网 2007/12/5 20:43:54 深山行者 字体:大 中 小 浏览 5448

以下代码集合常用的弹出窗口用法.

1、最基本的弹出窗口代码

以下是引用片段:
< SCRIPT LANGUAGE="javascript"> 
< !-- 
window.open ('page.html') 
--> 
< /SCRIPT> 

代码放在< SCRIPT LANGUAGE="javascript">标签和< /script>之间。
< !-- 和 -->是对一些版本低的浏览器起作用。
window.open ('page.html') 用于控制弹出新的窗口page.html,如果page.html不与主窗口在同一路径下,前面应写明路径,绝对路径(http://)和相对路径(../)均可。用单引号和双引号都可以,只是不要混用。
这一段代码可以加入HTML的任意位置,< head>和< /head>之间可以,< body>间< /body>也可以,越前越早执行,尤其是页面代码长,又想使页面早点弹出就尽量往前放。


2、经过设置后的弹出窗口

定制这个弹出的窗口的外观,尺寸大小,弹出的位置以适应该页面的具体情况。

以下是引用片段:
< SCRIPT LANGUAGE="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> 

参数解释:
以下是引用片段:
< SCRIPT LANGUAGE="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> 
< script LANGUAGE="javascript"> 
< !-- 
function openwin() { window.open ("page.html", "newwindow", "height=100, width=400, toolbar= no, menubar=no, scrollbars=no, resizable=no, location=no, status=no") 
//写成一行 
} 
//--> 
< /script> 
< /head> 
< body onload="openwin()"> 
...任意的页面内容... 
< /body> 
< /html> 


这里定义了一个函数openwin(),函数内容就是打开一个窗口。在调用它之前没有任何用途。
怎么调用呢?
方法一:< body onload="openwin()"> 浏览器读页面时弹出窗口;
方法二:< body onunload="openwin()"> 浏览器离开页面时弹出窗口;
方法三:用一个连接调用:
< a href="#" onclick="openwin()">打开一个窗口< /a>
注意:使用的“#”是虚连接。
方法四:用一个按钮调用:
< input type="button" onclick="openwin()" value="打开窗口">

相关阅读
添加一个防下载字段(长二进制数据)来防止ACCESS数据库被下载
网页制作,改变你的思维方
javascript根据内容转换为拼音
山西省太原夏日阳光国际旅行社
启动旅行社管理系统3.0的开发服务
CSS编写中灵活运行注释的意义
利ASP里的FOS导出WORD或Excel文档(本人测试成功)
四川省中国青年旅行社长顺分社
更多信息>>栏目类别选择
百度小程序开发
微信小程序开发
微信公众号开发
uni-app
asp函数库
ASP
DIV+CSS
HTML
python
更多>>同类信息
2026 aliyun阿里域名云注册续费优惠口令
dw里面查找替换使用正则删除sqlserver里面的CONSTRAINT
javascript获取浏览器指纹可以用来做投票
火狐Mozilla Firefox出现:无法载入您的Firefox配置文件 它可能已经丢失 或是无法访问 问题解决集合处理办法
DW设置之后更好用 DreamweaverCS编辑GB2312与UTF-8文件在代码视图中点击鼠标错位问题的解决办法
js指定日期加n天加n月加n年
更多>>最新添加文章
2026 aliyun阿里域名云注册续费优惠口令
dw里面查找替换使用正则删除sqlserver里面的CONSTRAINT
Android移动端自动化测试:使用UIAutomatorViewer与Selenium定位元素
抖音直播音挂载小雪花 懂车帝小程序
javascript获取浏览器指纹可以用来做投票
火狐Mozilla Firefox出现:无法载入您的Firefox配置文件 它可能已经丢失 或是无法访问 问题解决集合处理办法
在Android、iOS、Windows、MacOS中微信小程序的文件存放路径
python通过代码修改pip下载源让下载库飞起
更多>>随机抽取信息
深山行者留言系统V3.3发布
建国60周年(红色)留言板模板
抖音直播音挂载小雪花 懂车帝小程序
asp随机显示图象
javascript 表单(文本框)触发鼠标事件大全
万圣节留言板模板