篇首语:本文由小编为大家整理,主要介绍了使用window.open()打开新的窗口相关的知识,希望对你有一定的参考价值。
本实例要在窗口每次被加载的时候弹出一个话框。
本实例主要应用 javascript 的 window 对象。
window 对象的常用方法:
- alert() 弹出一个警告对话框
- confirm() 在确认对话框中显示指定的字符串
- prompt() 弹出一个提示对话框
- close() 关闭被引用的窗口
- focus() 将被引用的窗口放在所有打开窗口的前面
- open() 打开新浏览器窗口并且显示由URL或名字引用的文档,并设置创建窗口的属性
- resizeTo(x,y) 设置窗口的大小
- resizeBy(offsetx,offsety) 按照指定的位移量设置窗口的大小
应用 JavaScript 的 open()方法可以打开浏览器窗口。
使用 window 对象打开窗口的语法格式如下。
WindowVar = window.open(url, windowname, location);
参数说明如下:
1. WindowVar
: 当前打开窗口的句柄。
2. url
: 目标窗口的URL。
3. windowname
: window:对象的名称。
4. location
: 对窗口属性进行设置。
对窗口属性进行设置的可选参数:
width
窗口的宽度.height
窗口的高度.scrollbars
是否显示滚动条;resizable
设定窗口大小是否固定;toolbar
浏览器工具条,包括后退及前进按钮等;menubar
菜单条,一般包括有文件,编辑及其他一些条目;location
定位区,也叫地址栏,是可以输入URL的浏览器文本区;direction
更新信息按钮;
下面是一个演示实例:
index.html
html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Documenttitle> <style> * padding: 0; margin: 0; html, body background-color: #3e4377; h1 color: #FFF; style>head><body> <h1>HomePageh1> <script type="text/javascript" language="javascript"> window.onload = function() window.open("new.html", "new", "height=280, width=800, top=200, left=300, resizable=no, location=no", false); script>body>html>
new.html
<html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Documenttitle> <style> * padding: 0; margin: 0; html, body background: #8aa230; h1 color: #FFF; style>head><body> <p> <h1>Newh1> p>body>html>
效果截图:
如果,是需要指定事件后打开新页面的话,需要对index.html页面里的js代码做些修改,代码如下:
<script type="text/jscript" language="javascript"> function pp() window.open("new.html", "new", "height=280, width=80%,top=10%,left=10%,resizable=no, location=no", false); setTimeout("pp()", 5000); script>
以上是关于使用window.open()打开新的窗口的主要内容,如果未能解决你的问题,请参考以下文章