主页 > 生活百科 >

js 打开新窗口

生活百科 2022-10-29 19:15www.ai-classes.cn生活常识

js中怎么打开新窗口呢？不知道的小伙伴来看看小编今天的分享吧!

js中使用JavaScript window对象（属于BOM）打开新窗口。

1、语法

window.open(URL,na,features);

该方法用于打开一个新的浏览器窗口或查找一个已命名的窗口。

2、参数说明

URL 一个可选的字符串，声明了要在新窗口中显示的文档的 URL。如果省略了这个参数，或者它的值是空字符串，那么新窗口就不会显示任何文档。

na 一个可选的字符串，该字符串是一个由逗号分隔的特征列表，其中包括数字、字母和下划线，该字符声明了新窗口的名称。这个名称可以用作标记<a> 和 <form> 的属性 target 的值。如果该参数指定了一个已经存在的窗口，那么open()方法就不再创建一个新窗口，而只是返回对指定窗口的引用。在这种情况下，features 将被忽略。

features  一个可选的字符串，声明了新窗口要显示的标准浏览器的特征。如果省略该参数，新窗口将具有所有标准特征。

3、常用窗口特征

height、width窗口文档显示区的高度、宽度。以像素计。

left、窗口的x坐标、y坐标。以像素计

toolbar=yes | no | 1 | 0是否显示浏览器的工具栏。黙认是yes。

scrollbars=yes | no | 1| 0是否显示滚动条。黙认是yes。

location=yes | no | 1 | 0是否显示地址地段。黙认是yes。

status=yes | no | 1 | 0是否添加状态栏。黙认是yes。

nubar=yes | no | 1 | 0是否显示菜单栏。黙认是yes。

resizable=yes | no | 1 | 0窗口是否可调节尺寸。黙认是yes。

titlebar=yes | no | 1 | 0是否显示标题栏。黙认是yes。

fullscreen=yes | no | 1 | 0是否使用全屏模式显示浏览器。黙认是no。

注意不同的游览器对窗口特征属性支持也不相同。

4、使用案例

打开新的窗口，窗口特性使用默认值

<body>

<script type="text/javascript">

function openAnother() {

window.open("http://www.baidu."); //打开新窗口，窗口特性全部使用默认值。

}

</script>

<button οnclick="openAnother()">打开新窗口</button>

</body>

打开新的窗口，设置窗口特性

<body>

<button οnclick="openAnother();">打开新窗口</button>

<script type="text/javascript">

var win;

function openAnother () {

win = window.open("http://www.baidu.", "", "width=400, height=400,left = 200, right = 200, toolbar = no, nubar = no,location=no,resizable=no");//有些特性在个别浏览器上已被进制修改。

}

</script>

</body>

关闭新打开的窗口

open方法返回打开的那个窗口的window对象，可以调用close方法关闭新打开的窗口。

<body>

<button οnclick="openAnother();">打开新窗口</button>

<button οnclick="closeAnother();">关闭新打开的窗口</button>

<script type="text/javascript">

var win;

function openAnother () {

win = window.open("http://www.baidu.", "", "width=400, height=400,left = 200, right = 200, toolbar = no, nubar = no,location=no,resizable=no");

}

function closeAnother() {

win.close();//关闭指定窗口

}

</script>

</body>

以上就是小编今天的分享了，希望可以帮助到大家。

上一篇：python xlwt 下一篇：vue获取url参数

生活小妙招

Copyright © 2014-2025 Www.ai-classes.cn 爱句子网