新窗口的打开（window.open）的使用

深碍√TFBOYSˉ_ 2021-11-29 15:18 571阅读 0赞

刚学会用……

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0Fsb25lX2luXw_size_16_color_FFFFFF_t_70][]

我测试用的是Google浏览器哦！语法：

window.open( URL,name,specs,replace )

<table> 
 <thead> 
  <tr> 
   <th style="width:115px;">参数</th> 
   <th style="width:675px;">说明</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td style="width:115px;">URL</td> 
   <td style="width:675px;">打开指定的页面的URL。如果没有指定URL，打开一个新的空白窗口</td> 
  </tr> 
  <tr> 
   <td style="width:115px;">name</td> 
   <td style="width:675px;">指定target属性或窗口的名称。支持以下值： 
    <ul> 
     <li>_blank - URL加载到一个新的窗口。这是默认</li> 
     <li>_parent - URL加载到父框架</li> 
     <li>_self - URL替换当前页面</li> 
     <li>_top - URL替换任何可加载的框架集</li> 
     <li><em>name</em>&nbsp;- 窗口名称,相同 name 的窗口只能创建一个，要想创建多个窗口则 name 不能相同。name 不能包含有空格。</li> 
    </ul></td> 
  </tr> 
  <tr> 
   <td style="width:115px;">specs</td> 
   <td style="width:675px;"> <p>可选。一个逗号分隔的项目列表。支持以下值：<br> 常用的四个：</p> 
    <table> 
     <tbody> 
      <tr> 
       <td>top=pixels</td> 
       <td>窗口顶部距离屏幕顶部的像素数</td> 
      </tr> 
      <tr> 
       <td>left=pixels</td> 
       <td>窗口左侧距离屏幕左端的像素数</td> 
      </tr> 
      <tr> 
       <td>width=pixels</td> 
       <td> <p>窗口的宽度.最小.值为100</p> </td> 
      </tr> 
      <tr> 
       <td>height=pixels</td> 
       <td>窗口的高度最小值为100</td> 
      </tr> 
     </tbody> 
    </table> 
    <table> 
     <tbody> 
      <tr> 
       <td>channelmode=yes|no|1|0</td> 
       <td>是否要在影院模式显示 window。默认是没有的。仅限IE浏览器</td> 
      </tr> 
      <tr> 
       <td>directories=yes|no|1|0</td> 
       <td>是否添加目录按钮。默认是肯定的。仅限IE浏览器</td> 
      </tr> 
      <tr> 
       <td>fullscreen=yes|no|1|0</td> 
       <td>浏览器是否显示全屏模式。默认是没有的。在全屏模式下的 window，还必须在影院模式。仅限IE浏览器</td> 
      </tr> 
      <tr> 
       <td>location=yes|no|1|0</td> 
       <td>是否显示地址字段.默认值是yes</td> 
      </tr> 
      <tr> 
       <td>menubar=yes|no|1|0</td> 
       <td>是否显示菜单栏.默认值是yes</td> 
      </tr> 
      <tr> 
       <td>resizable=yes|no|1|0</td> 
       <td>是否可调整窗口大小.默认值是yes</td> 
      </tr> 
      <tr> 
       <td>scrollbars=yes|no|1|0</td> 
       <td>是否显示滚动条.默认值是yes</td> 
      </tr> 
      <tr> 
       <td>status=yes|no|1|0</td> 
       <td>是否要添加一个状态栏.默认值是yes</td> 
      </tr> 
      <tr> 
       <td>titlebar=yes|no|1|0</td> 
       <td>是否显示标题栏.被忽略，除非调用HTML应用程序或一个值得信赖的对话框.默认值是yes</td> 
      </tr> 
      <tr> 
       <td>toolbar=yes|no|1|0</td> 
       <td>是否显示浏览器工具栏.默认值是yes</td> 
      </tr> 
     </tbody> 
    </table></td> 
  </tr> 
  <tr> 
   <td style="width:115px;">replace</td> 
   <td style="width:675px;">Optional.Specifies规定了装载到窗口的 URL 是在窗口的浏览历史中创建一个新条目，还是替换浏览历史中的当前条目。支持下面的值： 
    <ul> 
     <li>true - URL 替换浏览历史中的当前条目。</li> 
     <li>false - URL 在浏览历史中创建新的条目。</li> 
    </ul></td> 
  </tr> 
 </tbody> 
</table>

示例：

<%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%>
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <script src="jquery-3.4.1.js"></script>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>小白网页</title>
    <script>
    	function open_win(){
    		window.open("http://www.baidu.com","_blank / _parent / _self / _top "
    			,"width=1500,height=680,top=165px,left=180px");
    	}
    </script>
    </head>
    <body>
    	
    <form>
    <input type="button" value="打开窗口" onclick="open_win()">
    </form>
    	
    </body>
    </html>

为了分开这个方法，实现共用，可以写个 JS 将这些配置放进去，然后引用在jsp页面引用js就可以了。（思路仅供参考哦~）

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0Fsb25lX2luXw_size_16_color_FFFFFF_t_70]: /images/20211129/847c39829fe2486688178c02f6e72b41.png