zoukankan      html  css  js  c++  java
  • window.showModalDialog的简单实践

    Super.jsp - 父窗口

     1 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
     2 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
     3 <html>
     4       <head>
     5           <%
     6         String path = request.getContextPath();
     7         String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
     8         %>
     9         <base href="<%=basePath %>Super.jsp">
    10         
    11         <title>Super.jsp</title>
    12       </head>
    13       
    14     <script type="text/javascript"> 
    15         function showLanguage()
    16         {
    17             var currObj =  new Object();
    18             var langObj = document.getElementById("language_id");
    19             currObj.language = langObj.value;
    20             var subReturn = window.showModalDialog("Sub.jsp",currObj,"dialogWidth:300px;dialogHeight:300px;");
    21             
    22             //防止返回的值为空字符串场景
    23             if((null == subReturn) || (typeof subReturn == "undefined")) 
    24             {
    25                 return;
    26             }
    27             
    28             langObj.value = subReturn;
    29         }
    30         
    31         function reset()
    32         {
    33             document.getElementById("language_id").value = "";
    34         }
    35         
    36         function setLang(sub_lang)
    37         {
    38             document.getElementById("language_id").value = sub_lang;
    39         }
    40     </script>
    41     
    42     <body>
    43         <div align="center" style="font-size: 18px;">
    44             当前语言:
    45             <input type="text" name="select_lang" id="language_id" readonly="readonly">
    46             &nbsp;&nbsp;
    47             <input type="button" name="selectLanguage" value="语 言" onclick="showLanguage()">
    48             <input type="button" name="resetLanguage" value="重 置" onclick="reset()">
    49         </div>
    50     </body>
    51 </html>

    Sub.jsp - 子窗口

      1 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
      2 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
      3 <html>
      4       <head>
      5           <%
      6         String path = request.getContextPath();
      7         String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
      8         %>
      9         <base href="<%=basePath %>Sub.jsp" target="_self">
     10         
     11         <title>Sub.jsp</title>
     12       </head>
     13       
     14     <script type="text/javascript">
     15         function selectLanguage()
     16         {
     17             var radio_names = document.getElementsByName("radio_name");
     18             if((null == radio_names) || (typeof radio_names == "undefined")) 
     19             {
     20                 alert("Pls choose a language !!!");
     21                 return;
     22             }
     23             
     24             var seleVal = "";
     25             
     26             for(var i=0; i<radio_names.length; i++)
     27             {
     28                 if(radio_names[i].checked == true)
     29                 {
     30                     seleVal = radio_names[i].value;
     31                     break;
     32                 }
     33             }
     34             
     35             window.returnValue = seleVal;
     36             
     37             window.close();
     38         } 
     39 
     40         function selectLanguage2()
     41         {
     42             var radio_names = document.getElementsByName("radio_name");
     43             if((null == radio_names) || (typeof radio_names == "undefined")) 
     44             {
     45                 alert("Pls choose a language !!!");
     46                 return;
     47             }
     48             
     49             var seleVal = "";
     50             
     51             for(var i=0; i<radio_names.length; i++)
     52             {
     53                 if(radio_names[i].checked == true)
     54                 {
     55                     seleVal = radio_names[i].value;
     56                     break;
     57                 }
     58             }
     59             
     60             //获取父窗口对象
     61             var opener = window.opener;
     62             //调用父窗口函数
     63             opener.setLang(seleVal);
     64             //window.opener.document.getElementById("language_id").value = seleVal;
     65             window.close();
     66         } 
     67     </script>
     68     
     69     <body>
     70         <form id="form1">
     71             <div>
     72                 <table style="border: 2px solid #CCCCCC;  100%" >
     73                     <thead>
     74                         <tr>
     75                             <th>选择</th><th>语言</th><th>类型</th>
     76                         </tr>
     77                     </thead>
     78                     <tbody>
     79                         <tr>
     80                             <td><input type="radio" name="radio_name" value="java"></td>
     81                             <td><div>Java</div></td>
     82                             <td><div>必选</div></td>
     83                         </tr>
     84                         <tr>
     85                             <td><input type="radio" name="radio_name" value="js"></td>
     86                             <td><div>JavaScript</div></td>
     87                             <td><div>可选</div></td>
     88                         </tr>
     89                     </tbody>
     90                 </table>
     91                 </br>
     92                 <input type="button" id="Button1" value="确  认(方式一)" onclick="selectLanguage()" />
     93                 <input type="button" id="Button1" value="确  认(方式二)" onclick="selectLanguage2()" />
     94             </div>
     95         </form>
     96     </body>
     97     
     98     <script type="text/javascript">
     99         var parentVals = window.dialogArguments;
    100         var parentLanguage = parentVals.language;
    101         var radio_names = document.getElementsByName("radio_name");
    102         for(var i=0; i<radio_names.length; i++)
    103         {
    104             if(radio_names[i].value == parentLanguage)
    105             {
    106                 radio_names[i].checked = true;
    107                 break;
    108             }
    109         }
    110     </script>
    111 </html>

    预览效果

  • 相关阅读:
    深度优先和广度优先搜索
    宏定义
    C++11新特性之七——final/override控制
    __declspec的用法
    zedboard学习(1)OLED驱动显示图像
    python+NLTK 自然语言学习处理三:如何在nltk/matplotlib中的图片中显示中文
    流畅python学习笔记第十八章:使用asyncio编写服务器
    流畅python学习笔记第十八章:使用asyncio包处理并发(二)
    Django之博客系统:自定义认证
    Django之博客系统:用户注册和Profile
  • 原文地址:https://www.cnblogs.com/maven-chao/p/6204391.html
Copyright © 2011-2022 走看看