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 相关文章推荐
兼容IE与firefox火狐的回车事件(js与jquery)
Oct 20 Javascript
关于window.pageYOffset和document.documentElement.scrollTop
Apr 05 Javascript
JavaScript实现x秒后自动跳转到一个页面
Jan 03 Javascript
js图片卷帘门导航菜单特效代码分享
Sep 10 Javascript
jQuery Real Person验证码插件防止表单自动提交
Nov 06 Javascript
Atitit.js的键盘按键事件捆绑and事件调度
Apr 01 Javascript
Angular2学习教程之ng中变更检测问题详解
May 28 Javascript
详解Webpack DLL用法以及功能
Jul 11 Javascript
Vue的Flux框架之Vuex状态管理器
Jul 30 Javascript
基于JQuery的Ajax方法使用详解
Aug 16 jQuery
JS图片懒加载技术实现过程解析
Jul 27 Javascript
js面向对象编程OOP及函数式编程FP区别
Jul 07 Javascript
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 分页分组类
2009/12/10 PHP
一个简单的php加密解密函数(动态加密)
2013/06/19 PHP
PHP连接数据库实现注册页面的增删改查操作
2016/03/27 PHP
zen cart实现订单中增加paypal中预留电话的方法
2016/07/12 PHP
用Javascript评估用户输入密码的强度实现代码
2011/11/30 Javascript
jQuery+css+html实现页面遮罩弹出框
2013/03/21 Javascript
JS实现商品倒计时实现代码
2013/05/03 Javascript
用Jquery实现滚动新闻
2014/02/12 Javascript
JS实现方向键切换输入框焦点的方法
2015/08/19 Javascript
JavaScript使用DeviceOne开发实战(四)仿优酷视频应用
2015/12/02 Javascript
jQuery实现获取table表格第一列值的方法
2016/03/01 Javascript
JavaScript和jquery获取父级元素、子级元素、兄弟元素的方法
2016/06/05 Javascript
js实现的页面加载完毕之前loading提示效果完整示例【附demo源码下载】
2016/08/02 Javascript
nodejs基础应用
2017/02/03 NodeJs
Angular.Js之Scope作用域的学习教程
2017/04/27 Javascript
详解vue-cli 快速搭建单页应用之遇到的问题及解决办法
2018/03/01 Javascript
Angular 封装并发布组件的方法示例
2018/04/19 Javascript
解决v-for中使用v-if或者v-bind:class失效的问题
2018/09/25 Javascript
jquery实现拖拽添加元素功能
2020/12/01 jQuery
[42:11]TNC vs Pain 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/20 DOTA
python中stdout输出不缓存的设置方法
2014/05/29 Python
一些Centos Python 生产环境的部署命令(推荐)
2018/05/07 Python
Pycharm设置界面全黑的方法
2018/05/23 Python
python中copy()与deepcopy()的区别小结
2018/08/03 Python
使用python处理题库表格并转化为word形式的实现
2020/04/14 Python
python 生成任意形状的凸包图代码
2020/04/16 Python
Python爬虫:Request Payload和Form Data的简单区别说明
2020/04/30 Python
Jeep牧马人、切诺基和自由人零配件:4 Wheel Drive Hardware
2017/07/02 全球购物
美国电子产品购物网站:BuyDig.com
2020/06/17 全球购物
中西医专业毕业生职业规划书
2014/02/24 职场文书
村党组织公开承诺书
2015/04/30 职场文书
情侣之间的道歉短信
2015/05/12 职场文书
MySQL锁机制
2021/04/05 MySQL
JavaScript嵌入百度地图API的最详细方法
2021/04/16 Javascript
MySQL注入基础练习
2021/05/30 MySQL
win10+RTX3050ti+TensorFlow+cudn+cudnn配置深度学习环境的方法
2022/06/25 Servers