JavaScript中window.open用法实例详解


Posted in Javascript onApril 15, 2015

本文较为详细的分析了JavaScript中window.open用法。分享给大家供大家参考。具体如下:

<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>

参数解释:

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为允许;

1、用函数控制弹出窗口
 
下面是一个完整的代码。

<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(),函数内容就是打开一个窗口。在调用它之前没有任何用途。怎么调用呢?
 
方法一: 浏览器读页面时弹出窗口;
 
方法二: 浏览器离开页面时弹出窗口;
 
方法三:用一个连接调用:打开一个窗口 注意:使用的“#”是虚连接。
 
方法四:用一个按钮调用:

2、定时关闭弹出的窗口 (有些网站注册成功后显示n秒转到注册前的那页信息,或自己跳转)
 
下面我们再对弹出的窗口进行一些控制,效果就更好了。
 
如果我们再将一小段代码 加入弹出的页面(注意是加入到page.html的HTML中,可不是主页面中,否则 ...),让它10秒后自动关闭是不是更酷了?
 
首先,将如下代码加入page.html文件的区:

<script language="Javascript">
function closeit()
{
setTimeout("self.close()",10000) //毫秒
}
</script>

然后,再用 这一句话代替page.html中原有的这一句就可以了。
 
(这一句话千万不要忘记写啊!这一句的作用是调用关闭窗口的代码 ,10秒钟后就自行关闭该窗口。

3、 仅弹出一次窗口(cookie控制)
 
回想一下,上面的弹出窗口虽然酷,但是有一点小毛病,比如你将上面的脚本放在一个需要频繁经过的页面里(例如首页),
 
那么每次刷新这个页面,窗口都会弹出一次,是不是非常烦人?有解决的办法吗?
 
我们使用cookie来控制一下。
 
首先,将如下代码加入主页面HTML的区:

<script>
function openwin()
{window.open("page.html","","width=200,height=200")}
function get_cookie(Name)
{
 var search = Name + "="
 var returnvalue = "";
 if (documents.cookie.length > 0) {
 offset = documents.cookie.indexOf(search)
 if (offset != -1) {
 offset += search.length
 end = documents.cookie.indexOf(";", offset);
 if (end == -1)
 end = documents.cookie.length;
 returnvalue=unescape(documents.cookie.substring(offset,end))
 }
 }
 return returnvalue;
}
function loadpopup(){
 if (get_cookie('popped')==''){
 openwin() ;
documents.cookie="popped=yes" ;
 }
}
</script>

然后,用(注意不是openwin而是loadpop啊!) 替换主页面中原有的

这一句即可。你可以试着刷新一下这个页面或重新进入该页面,窗口再也不会弹出了。

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
jquery-syntax动态语法着色示例代码
May 14 Javascript
jQuery控制TR显示隐藏的几种方法
Jun 18 Javascript
javascript中的遍历for in 以及with的用法
Dec 22 Javascript
javascript实现加载xml文件的方法
Nov 24 Javascript
js实现动态创建的元素绑定事件
Jul 19 Javascript
AngularJS入门教程之双向绑定详解
Aug 18 Javascript
Angular表单验证实例详解
Oct 20 Javascript
js控制台输出的方法(详解)
Nov 26 Javascript
javascript中BOM基础知识总结
Feb 14 Javascript
vue实现仿淘宝结账页面实例代码
Nov 08 Javascript
30分钟精通React今年最劲爆的新特性——React Hooks
Mar 11 Javascript
详解Vue router路由
Nov 20 Vue.js
flash+jQuery实现可关闭及重复播放的压顶广告
Apr 15 #Javascript
jQuery事件绑定与解除绑定实现方法
Apr 15 #Javascript
JavaScript表格常用操作方法汇总
Apr 15 #Javascript
jQuery控制Div拖拽效果完整实例分析
Apr 15 #Javascript
详细解密jsonp跨域请求
Apr 15 #Javascript
jQuery插件zoom实现图片全屏放大弹出层特效
Apr 15 #Javascript
javascript中Math.random()使用详解
Apr 15 #Javascript
You might like
全国FM电台频率大全 - 22 重庆市
2020/03/11 无线电
mongo Table类文件 获取MongoCursor(游标)的实现方法分析
2013/07/01 PHP
php strnatcmp()函数的用法总结
2013/11/27 PHP
php设置静态内容缓存时间的方法
2014/12/01 PHP
yii分页组件用法实例分析
2015/12/28 PHP
学习jquery必备 api中英文对照的chm手册 下载
2007/05/03 Javascript
jquery 双色表格实现代码
2009/12/08 Javascript
Javascript学习笔记之函数篇(五) : 构造函数
2014/11/23 Javascript
jQuery对于显示和隐藏等常用状态的判断方法
2014/12/13 Javascript
EasyUI实现第二层弹出框的方法
2015/03/01 Javascript
JQuery鼠标移到小图显示大图效果的方法
2015/06/10 Javascript
jQuery实现响应鼠标背景变化的动态菜单效果代码
2015/08/27 Javascript
javascript实现的网站访问量统计代码
2015/12/20 Javascript
jquery遍历json对象集合详解
2016/05/18 Javascript
js插件dropload上拉下滑加载数据实例解析
2016/07/27 Javascript
简单实现jQuery多选框功能
2017/01/09 Javascript
vue axios登录请求拦截器
2018/04/02 Javascript
微信小程序文章详情页面实现代码
2018/09/10 Javascript
layUI的验证码功能及校验实例
2019/10/25 Javascript
[01:43]深扒TI7聊天轮盘语音出处4
2017/05/11 DOTA
Python中实现的RC4算法
2015/02/14 Python
python中快速进行多个字符替换的方法小结
2016/12/15 Python
pycharm新建一个python工程步骤
2019/07/16 Python
css3动画效果小结(推荐)
2016/07/25 HTML / CSS
Hotels.com爱尔兰:全球酒店预订
2017/02/24 全球购物
生产经理的自我评价分享
2013/11/07 职场文书
岗位职责的构建方法
2014/02/01 职场文书
水利学院求职自荐书
2014/02/01 职场文书
卖车协议书
2014/04/21 职场文书
测绘工程专业求职信
2014/07/15 职场文书
集体生日活动方案
2014/08/18 职场文书
2014最新版群众路线四风整改措施
2014/09/24 职场文书
2015教师年度考核评语
2015/03/25 职场文书
运动会100米广播稿
2015/08/19 职场文书
教你用python实现一个无界面的小型图书管理系统
2021/05/21 Python
基于Redis的List实现特价商品列表功能
2021/08/30 Redis