window.open打开新窗口 参数

摘要:
1.基本描述oNewWindow=窗口打开窗口。open打开窗口后,将返回表示窗口对象的变量oNewWindow。如果打开失败,则oNewWindow的值为空。对于信息显示窗口,用户可以在阅读后将其关闭。然而,为了使窗口继续处理,用户通常需要在继续处理之后与原始窗口进行交互。例如,当在新窗口中创建文章并提交时,用户希望在弹出窗口关闭时原始窗口可以刷新。

1,基本描述

       oNewWindow = window.open( sURL , sName , sFeatures, bReplace)   

  window.open在打开一个窗口(其url为sURL)后,将返回一个代表该窗口对象的一个变量oNewWindow,如果打开不成功,则oNewWindow的值为null。同时为了对打开的窗口预先做一些控制,提供了其他一些参数(sName、sFeatures、bReplace)可供选择配置,下面将具体说明每个参数的含义

  * oNewWindow:被打开的窗口的对象
  * sUrl:被打开窗口的url
  * sName:在哪个窗口打开新的url链接,例如可以为_blank(新窗口)、_top(最外层窗口)等等
  * sFeatures:对窗口的一些控制属性
    o fullscreen:是否为全屏模式(相当于F11的效果),可取值:yes/1、no/0
    o directories:是否带有目录按钮(例如收藏夹中的’链接’目录),可取值同上
    o location:是否带有地址栏,可取值同上
    o channelmode:是否为影院模式,可取值同上
    o menubar:是否带有菜单条,可取值同上
    o resizable:是否可以改变窗口的尺寸,可取值同上
    o scrollbars:是否带有滚动条,可取值同上
    o status:是否带有状态栏,可取值同上
    o titlebar:是否带有标题栏,可取值同上
    o toolbar:是否带有快捷工具栏,可取值同上
    o height:窗口高度
    o width:窗口宽度
    o top:距屏幕上边缘的距离
    o left:距屏幕左边缘的距离
       * bReplace:如果在同一窗口打开新窗口,该值用于指定是否在history中替换原窗口的url链接,可取值:true/false

2,基本使用

  在一个新窗口中打开某个链接link(/myoa/admin/manage.jsp)

    window.open ( “/myoa/admin/manage.jsp” ) 或者 window.open ( “/myoa/admin/manage.jsp” , “_blank” ) ;
    注意:这样的话,每次执行都会打开一个新窗口,即使上次打开的新窗口未关闭,仍然会弹出新的

  在指定的某个窗口中打开某个链接link(/myoa/admin/manage.jsp)

    window.open ( “/myoa/admin/manage.jsp” , “myWiddown” ) ; //myWindow即为窗口的名称
    注意:如果myWindow窗口不存在,那么将会新弹出一个窗口,并将新窗口命名为myWindow,只要该窗口不关闭,那么以后执行该open,弹出窗口均为这个已经存在的myWindow
    另外,有一些窗口名称已经被浏览器使用,具有特殊的含义,例如:_blank、_top、_parent、_self等

  打开一个新窗口,要求窗口高度300px、宽度500px、不带滚动条、不带地址栏(/myoa/admin/manage.jsp)

    window.open ( “/myoa/admin/manage.jsp” , “_blank” ,“height=300,width=500,scrollbars=no,location=no” ) ;

    注意:sFeatures这些参数之间是用逗号分隔的,而在window.showModalDialog中,是用分号进行分隔的,一定要注意

3,高级部分

  原窗口与弹出窗口之间的对象定位
    概述:弹出窗口是我们在页面编程中经常使用的一种方式,从互动角度分析,弹出窗口主要有两种类型,一种是信息显示窗口,例如人员信息、文章信息等等;另外一种是继续处理窗口,例如有些项目中,新建文章就是弹出窗口来完成的。对于信息显示窗口,用户看完之后关闭就可以了,但是对于继续处理窗口,在用户继续处理之后,往往需要与原窗口进行互动,例如当在新窗口中创建一篇文章提交后,希望在弹出窗口关闭的同时,原窗口能够刷新等等。

    解决方式:上面方式的一个关键就是,如何获取原窗口与弹出窗口对象,在DOM模型中我们可以明确的看到:
         原窗口中获取弹出窗口对象:var infoWindow=window.open ( “create.jsp” , “_blank” , “width=500,height=400″ ) ;//infoWindow即代表了弹出窗口的window对象,例如在弹出窗口中有一个表单(myForm)和表单中的一个输入控件  (username),我们可以这样操作:infoWindow.document.myForm.username.value=“lisi”;

           弹出窗口中获取原窗口对象:如上例,在create.jsp中,我们可以如下操作来刷新原窗口opener.location.reload () ;//opener是DOM中提供的一个默认对象,表示的就是某个窗口的原窗口。

  window.open的缓存处理
    概述:如果window.open链接的target指定的是一个已经存在了的窗口,尤其是原页面中的一个frame和iframe的话,此时 window.open打开的链接页面将不会从服务器重新请求,而是使用浏览器中相应的缓存页面,至少ie给人的感觉就是这样的.

    例如:

      <input type=“button” value=“显示列表” onclick=“window.open(’/myoa/users/list.jsp’,'main’,”)” />

      <iframe name=“main” src= “/myoa/users/list.jsp” width= “100%” height= “600″  frameborder="0″ ></iframe>

      第一次访问该页面是可以看到一个列表,那么此时即使新创建一条记录,那么再点击“显示列表”按钮时,会发现列表没有发生变化,此时关闭浏览器重新进行发现列表出现了刚创建的那条记录,可见缓存起了作用。

    解决办法:实验中我们发现,中导向链接不会发生上面的现象,每次都是重新请求,同样是上面的例子,使用下面的方式就是可以的:

        <a href= “/myoa/users/list.jsp” target= “main” >显示列表</a>
        <iframe name= “main” src= “/myoa/users/list.jsp” width= “100%” height= “600″ frameborder=“0″ ></iframe>

        不过有许多时候,我们不得不使用window.open到本页面某个iframe的方式,那么可以这样解决:

        <input type=”button” value=”显示列表” onclick=”document.getElementById(’showlist’).click()”/>
        <a href=”/myoa/users/list.jsp” target=”main” id=”showlist” style=”display:none”>显示列表</a>
        <iframe name=”main” src=”/myoa/users/list.jsp” width=”100%” height=”600″ frameborder=”0″></iframe>

免责声明:文章转载自《window.open打开新窗口 参数》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇自定义组合控件SettingItemView的简单实现ios cocoapods获取不到最新库的原因主要有两个:下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

JS/jQuery刷新iframe的方法

一、js 页面刷新1.  reload 方法,该方法强迫浏览器刷新当前整个页面。  语法:location.reload([bForceGet])  参数: bForceGet, 可选参数, 默认为 false,从客户端缓存里取当前页。true, 则以 GET 方式,从服务端取最新的页面, 相当于客户端点击 F5("刷新") <script lang...

js中几种实用的跨域方法原理详解

什么是同源策略?同源策略/SOP(Same origin policy)是一种约定,由Netscape公司1995年引入浏览器,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,浏览器很容易受到XSS、CSFR等攻击。所谓同源是指"协议+域名+端口"三者相同,即便两个不同的域名指向同一个ip地址,也非同源。 同源策略限制以下几种行为: 1、Cooki...

Chrome实用调试技巧

如今Chrome浏览器无疑是最受前端青睐的工具,原因除了界面简洁、大量的应用插件,良好的代码规范支持、强大的V8解释器之外,还因为Chrome开发者工具提供了大量的便捷功能,方便我们前端调试代码,我们在日常开发中是越来越离不开Chrome,是否熟练掌握Chrome调试技巧恐怕也会成为考量前端技术水平的标杆。 介绍Chrome调试技巧的文章很多,本文结合我自...

Web自动化学习(4)

1、Selenium中有哪些不同类型的定位器? 定位器可以看作一个地址,用于在网页中唯一标识一个页面元素,为了准确地识别Web元素 Selenium中有8种不同的定位方式:ID;ClassName;Name;TagName;LinkText;PartialLinkText;Xpath;CSS Selector。 2、什么是XPath? 元素定位方式的一种...

bootstrap添加iframe页

改写自: https://www.cnblogs.com/yxgmagic/p/9637075.html 效果图: <div class="ibox float-e-margins"> <div id="tabContainer"></div> </div> <scri...

iframe高度自适应的6个方法

原文链接:http://caibaojian.com/iframe-adjust-content-height.html JS自适应高度,其实就是设置iframe的高度,使其等于内嵌网页的高度,从而看不出来滚动条和嵌套痕迹。对于用户体验和网站美观起着重要作用。 如果内容是固定的,那么我们可以通过CSS来给它直接定义一个高度,同样可以实现上面的需求。当内容是...