`

window.open()方法使用

阅读更多
  • window.open()支持环境: JavaScript1.0+/JScript1.0+/Nav2+/IE3+/Opera3+

  • 基本语法:

window.open(pageURL,name,parameters)
其中:
pageURL 为子窗口路径
name 为子窗口句柄
parameters 为窗口参数(各参数用逗号分隔)

  • 示例:

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


脚本运行后,page.html将在新窗体newwindow中打开,宽为100,高为400,距屏顶0象素,屏左0象素,无工具条,无菜单条,无滚动条,不可调整大小,无地址栏,无状态栏。

上例中涉及的为常用的几个参数,除此以外还有很多其他参数,如下所示:

各项参数

其中yes/no也可使用1/0;pixel value为具体的数值,单位象素。

参数 | 取值范围 | 说明

alwaysLowered | yes/no | 指定窗口隐藏在所有窗口之后
alwaysRaised | yes/no | 指定窗口悬浮在所有窗口之上
depended | yes/no | 是否和父窗口同时关闭
directories | yes/no | Nav2和3的目录栏是否可见
height | pixel value | 窗口高度
hotkeys | yes/no | 在没菜单栏的窗口中设安全退出热键
innerHeight | pixel value | 窗口中文档的像素高度
innerWidth | pixel value | 窗口中文档的像素宽度
location | yes/no | 位置栏是否可见
menubar | yes/no | 菜单栏是否可见
outerHeight | pixel value | 设定窗口(包括装饰边框)的像素高度
outerWidth | pixel value | 设定窗口(包括装饰边框)的像素宽度
resizable | yes/no | 窗口大小是否可调整
screenX | pixel value | 窗口距屏幕左边界的像素长度
screenY | pixel value | 窗口距屏幕上边界的像素长度
scrollbars | yes/no | 窗口是否可有滚动栏
titlebar | yes/no | 窗口题目栏是否可见
toolbar | yes/no | 窗口工具栏是否可见
Width | pixel value | 窗口的像素宽度
z-look | yes/no | 窗口被激活后是否浮在其它窗口之上

  • 用函数控制弹出窗口

下面是一个完整的代码。
<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(),函数内容就是打开一个窗口。怎么调用呢?

方法一:
<body onload="openwin()">

浏览器读页面时弹出窗口;

方法二:
<body onunload="openwin()">

浏览器离开页面时弹出窗口;

方法三:
用一个连接调用:
<a href="#" onclick="openwin()">打开一个窗口</a>

注意:使用的“#”是虚连接。

方法四:
用一个按钮调用:
<input type="button" onclick="openwin()" value="打开窗口"> 


引用
如何实现在不使用window.showModalDialog 的情况下用 window.open方式 向父窗口返回值。

例如: 页面AAA.htm 用 window.open方式弹出页面 BBB.htm 。
在页面BBB.htm上选择一个值,确定关闭窗口后将选择的这个值返回到父窗口AAA.htm。
AAA.htm得到返回的值后,给本页面上的文本框赋值。


BBB.htm页面中加入下面代码:
	window.opener.document.getElementById("theTextAreaId").value = document.getElemnetById("theSelectId").value ; 


  • window.opener 的用法

window.opener 返回的是创建当前窗口的那个父窗口的引用,比如点击了a.htm上的一个链接而打开了b.htm,然后我们打算在b.htm上输入一个值然后赋予a.htm上的一个id为“name”的textbox中,就可以写为:

window.opener.document.getElementById("name").value = "输入的数据";


对于javascript中的window.opener没有很好的理解。
为什么框架中不能使用,弹出窗口的父窗口不能在框架里面的某个页面呢?那怎样通过弹出窗口操作框架中的父窗口呢?
opener.parent.frames['frameName'].document.all.input1.value


即opener这个对象为前一个窗口,可以使用window.opener.document...调用document的相关方法,例如下面的例子,插入一些table行到前一个窗口:
function taletoTb(itemStr) {   
        newRow = opener.document.all.itemTb.insertRow(opener.document.all.itemTb.rows.length);   
        rowCnt = opener.document.all.itemTb.rows.length;   
        newCell = newRow.insertCell();   
        newCell.insertAdjacentHTML('BeforeEnd','<div align="center">'+itemCode+'</div>');   
        newCell = newRow.insertCell();   
        newCell.insertAdjacentHTML('BeforeEnd','<div align="center">'+itemName+'</div>');   
        newCell = newRow.insertCell();   
        newCell.insertAdjacentHTML('BeforeEnd','<div align="center"><img src="../../../images/delete2.gif" width="12" height="12" onClick="userRightDel(this);"><input type="hidden" name="itembox" value='+itemCode+'></div>');   
     }  
分享到:
评论

相关推荐

    window.open最大化问题

    在上面的代码中,我们首先使用 Window.open 方法打开一个新的窗口,然后使用 moveTo 方法将窗口移动到左上角,接着使用 focus 方法将焦点设置到新打开的窗口中,最后使用 blur 方法将焦点从当前窗口移除。...

    window.open.txt

    根据提供的文件信息,我们可以深入探讨`window.open()`方法在不同浏览器环境下的特性和使用细节。 ### window.open() 方法概述 `window.open()`是JavaScript中一个非常实用的方法,它用于在一个新的浏览器窗口或...

    window.showModalDialog模式对话框和 window.open的区别

    `window.showModalDialog` 和 `window.open` 都是JavaScript提供的两种打开新窗口的方法,但它们在功能和使用场景上有着显著的区别。 首先,我们来详细探讨`window.showModalDialog`。`showModalDialog`方法用于...

    window.open最大化操作

    Window.open最大化操作 在Web开发中,我们经常需要弹出新的浏览器窗口,而在某些...然而,使用window.open方法来实现窗口的最大化需要使用setTimeout方法来延迟执行JavaScript代码,以便在子页面中实现窗口的最大化。

    window.open打开新窗口参数设置

    本文将深入探讨如何使用 `window.open()` 方法及其参数设置,帮助开发者更好地掌握此方法的用法。 #### 一、`window.open()` 基本用法 `window.open()` 方法的基本语法为: ```javascript var newWindow = window...

    Window.Open详解

    ### Window.open() 方法详解 #### 一、方法简介 `window.open()` 是一个在Web开发中经常被用来创建新浏览器窗口或标签页的方法。此方法是 `window` 对象的一个属性,通过调用该方法可以指定打开的新窗口的URL、...

    javascript弹出窗口 window.open使用方法以及参数说明分析篇

    window.open使用方法以及参数说明一、window.open()支持环境: JavaScript1.0+/JScript1.0+/Nav2+/IE3+/Opera3+ 二、基本语法: window.open(pageURL,name,parameters) 其中: pageURL 为子窗口路径 name 为子窗口...

    window.open方法post请求

    使用window.open()方法发送post请求

    js弹窗并返回值(window.open方式)

    在JavaScript中,`window.open`方法是一个非常实用的功能,它允许开发者创建新的浏览器窗口或标签页,并在其中加载指定的网页内容。这个方法在交互式用户界面设计中尤其常见,例如用于显示警告、确认对话框或者...

    window.open打开新窗口,不被拦截的方法

    基本使用方法 首先来看一下`window.open()`的基本用法: ```javascript window.open(URL, target, features); ``` - **URL**:指定要打开的新窗口的地址。 - **target**:指定新窗口的名字,可以是特定的名称...

    Javascript中封装window.open解决不兼容问题

    对window.open进行封装, 使其更好用, 且更兼容, 很多人说window.open不兼容,其实不是, 因为不能直接执行, 必须通过用户手动触发才行;看代码: 代码如下 var openWindow = function(url, options) { var str = ""; ...

    window.open父子窗口传值问题

    1. **使用URL参数**:在`window.open`的`url`中添加查询参数来传递数据。例如: ```javascript var url = "child.html?data=" + encodeURIComponent(value); var newWindow = window.open(url, "child"); ``` 2...

    window.open的例子和使用方法以及参数说明

    windows.open这个是JavaScript函数,但是在应用起来的时候总会遇到比较多的麻烦,因为参数非常多,用法也非常的多

    前端window.open实现激活而非打开的功能

    扩展window.open方法,使得window.open时针对相同的URL地址非打开新窗口,而是仅仅激活已存在窗口,另外,此激活不会刷新页面,不会丢失页面上已存在的数据

    window.showModalDialog以及window.open用法简介

    Window.showModalDialog 和 Window.open 都是 JavaScript 中的方法,用于创建新窗口或对话框,下面分别介绍它们的用法和参数。 一、Window.open() 方法 Window.open() 方法用于打开一个新的浏览器窗口,可以指定新...

    字符串 window.open() window.opener window.name window对象等的总结

    `window.open()` 是一个非常实用的方法,用于打开新的浏览器窗口、标签或替换当前窗口的内容。它的语法如下: ```javascript window.open(url, name, features, replace); ``` - `url`:新窗口加载的URL。 - `name...

    window.open 参数 详细说明

    一、window.open()支持环境: 二、基本语法: 三、示例: 四、各项参数

    详解js location.href和window.open的几种用法和区别.docx

    location.href 和 window.open 是 JavaScript 中两个常用的方法,用于控制浏览器的导航和窗口操作。它们的用法和区别是很多开发者需要了解和掌握的知识点。 一、location.href 的几种形式 location.href 属性返回...

    ShowModalDialog与window.open的区别

    使用方法** ```javascript var returnValue = window.showModalDialog(sURL, vArguments, sFeatures); ``` **3. 参数说明** - **sURL**: 必需参数,指定要显示的文档的URL。 - **vArguments**: 可选参数,传递给...

Global site tag (gtag.js) - Google Analytics