zoukankan      html  css  js  c++  java
  • window.open

    摘要:

      当点击某个按钮或者某个事件发生出发浏览器打开一个新的窗口,这种交互在我们开发的时候经常会见到,一般有两种方法:

    1. 通过a标签,<a href="">click</a>,当点击click是就会跳转页面
    2. 通过javascript的window.open()

      下面我们来分析下第二种方法

     window.open

    示例:

    window.open('http://www.cnblogs.com/xiyangbaixue/','new', 'width=960,height=650,menubar=no,toolbar=no,location=no,directories=no,status=no,scrollbars=yes,resizable=yes');

     分析一下其中的参数(其中yes/no也可使用1/0,pixelvalue为具体的数值,单位象素):

    alwaysLowered|yes/no|指定窗口隐藏在所有窗口之后

    alwaysRaised|yes/no|指定窗口悬浮在所有窗口之上

    depended|yes/no|是否和父窗口同时关闭

    directories|yes/no|Nav2和3的目录栏是否可见

    height|pixelvalue|窗口高度

    hotkeys|yes/no|在没菜单栏的窗口中设安全退出热键

    innerHeight|pixelvalue|窗口中文档的像素高度

    innerWidth|pixelvalue|窗口中文档的像素宽度

    location|yes/no|位置栏是否可见

    menubar|yes/no|菜单栏是否可见

    outerHeight|pixelvalue|设定窗口(包括装饰边框)的像素高度

    outerWidth|pixelvalue|设定窗口(包括装饰边框)的像素宽度

    resizable|yes/no|窗口大小是否可调整

    screenX|pixelvalue|窗口距屏幕左边界的像素长度

    screenY|pixelvalue|窗口距屏幕上边界的像素长度

    scrollbars|yes/no|窗口是否可有滚动栏

    titlebar|yes/no|窗口题目栏是否可见

    toolbar|yes/no|窗口工具栏是否可见

    Width|pixelvalue|窗口的像素宽度

    z-look|yes/no|窗口被激活后是否浮在其它窗口之上

    status|yes/no|是否显示状态栏内的信息

    left|pixelvalue|窗口距离屏幕左侧的象素值

    top|pixelvalue|窗口距离屏幕上方的象素值
      

      

    注意:window.open()是在新的tab页打开的,如果我们想弹出一个新的窗口怎么办呢?只需要加上下面的代码

    window.open('绝对路径','_blank', 'width=960,height=650,menubar=no,toolbar=no,location=no,directories=no,status=no,scrollbars=yes,resizable=yes');

    这样就能实现在所有浏览器下都是弹出一个新窗口

    扩展:

    1. 点击一下改变当前页面内容同时弹出一个新窗口
      <a href="one.html" onclick="window.open('two.html')">click</a>
    2. 在子窗口操作时,刷新父窗口
      opener.location.href=opener.location.href
  • 相关阅读:
    SpringBoot入门(一)——开箱即用
    四六级成绩查询,你的『验证码』刷出来了吗?
    Kubernetes 在网易云中的落地优化实践
    漫画:深入浅出 ES 模块
    两分钟了解Docker的优势
    浅析Kubernetes的工作原理
    常用数据清洗方法大盘点
    移动端推广APP防作弊机制之依我见
    十一、观察者模式(Observable、Observer)
    paip.最新的c++ qt5.1.1环境搭建跟hello world
  • 原文地址:https://www.cnblogs.com/xiyangbaixue/p/3959954.html
Copyright © 2011-2022 走看看