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 相关文章推荐
JavaScript中获取未知对象属性的代码
Apr 27 Javascript
js实现div的切换特效上一个下一个
Feb 11 Javascript
js/jquery判断浏览器的方法小结
Sep 02 Javascript
js判断手机和pc端选择不同执行事件的方法
Jan 30 Javascript
JavaScript中的冒泡排序法
Aug 03 Javascript
Node.js测试中的Mock文件系统详解
Nov 21 Javascript
浅谈JavaScript的函数及作用域
Dec 30 Javascript
基于Axios 常用的请求方法别名(详解)
Mar 13 Javascript
bootstrap自定义样式之bootstrap实现侧边导航栏功能
Sep 10 Javascript
bootstrap下拉分页样式 带跳转页码
Dec 29 Javascript
JS实现点击生成UUID的方法完整实例【基于jQuery】
Jun 12 jQuery
vue-cli3.0修改打包后的文件名和文件地址,打包后本地运行报错解决
Apr 06 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
php的header和asp中的redirect比较
2006/10/09 PHP
php Notice: Undefined index 错误提示解决方法
2010/08/29 PHP
php 面向对象的一个例子
2011/04/12 PHP
PHP实现补齐关闭的HTML标签
2016/03/22 PHP
学习PHP的数组总结【经验】
2016/05/05 PHP
thinkphp5框架API token身份验证功能示例
2019/05/21 PHP
PHP pthreads v3在centos7平台下的安装与配置操作方法
2020/02/21 PHP
说说掌握JavaScript语言的思想前提想学习js的朋友可以看看
2009/04/01 Javascript
extjs 的权限问题 要求控制的对象是 菜单,按钮,URL
2010/03/09 Javascript
jQuery中detach()方法用法实例
2014/12/25 Javascript
AngularJS表单编辑提交功能实例
2015/02/13 Javascript
jquery实现适用于门户站的导航下拉菜单效果代码
2015/08/24 Javascript
Bootstrap入门教程一Hello Bootstrap初识
2017/03/02 Javascript
jQuery简单实现的HTML页面文本框模糊匹配查询功能完整示例
2018/05/09 jQuery
layui实现数据表格隐藏列的示例
2019/10/25 Javascript
vue设置一开始进入的页面教程
2019/10/28 Javascript
15个简单的JS编码标准让你的代码更整洁(小结)
2020/07/16 Javascript
js实现点击选项置顶动画效果
2020/08/25 Javascript
python实现ip查询示例
2014/03/26 Python
详解python调度框架APScheduler使用
2017/03/28 Python
Python实现的下载网页源码功能示例
2017/06/13 Python
Python爬虫实现全国失信被执行人名单查询功能示例
2018/05/03 Python
python 重定向获取真实url的方法
2018/05/11 Python
Python sklearn KFold 生成交叉验证数据集的方法
2018/12/11 Python
详解Python requests 超时和重试的方法
2018/12/18 Python
Python-ElasticSearch搜索查询的讲解
2019/02/25 Python
python global关键字的用法详解
2019/09/05 Python
pytorch 自定义参数不更新方式
2020/01/06 Python
python计算Content-MD5并获取文件的Content-MD5值方式
2020/04/03 Python
django的autoreload机制实现
2020/06/03 Python
汽车专业毕业生推荐信
2013/11/12 职场文书
园林设计专业毕业生求职信
2014/03/23 职场文书
行政专员岗位职责说明书
2014/09/01 职场文书
2015年护士节慰问信
2015/03/23 职场文书
工程主管竞聘书
2015/09/15 职场文书
新兵入伍决心书
2015/09/22 职场文书