zoukankan      html  css  js  c++  java
  • js showModalDialog参数传递

    showModalDialog:模式窗口, 一种很特别的窗口,当它打开时,后面的父窗口的活动会停止,除非当前的模式子窗口关闭了, 才能操作父窗口.在做网页Ajax开发时,我们应该有时会用到它来实现表单的填写, 或做类似网上答题的窗口. 它的特点是,传参很方便也很强大,可直接调用父窗口的变量和方法.

    使用方法:  
       vReturnValue    =    window.showModalDialog(sURL    [,    vArguments]    [,sFeatures])  

       参数说明:  
       sURL--  
       必选参数,类型:字符串。用来指定对话框要显示的文档的URL。  
       vArguments--  
       可选参数,类型:变体。用来向对话框传递参数。传递的参数类型不限,包括数组等。对话框通过window.dialogArguments来取得传递进来的参数。  
       sFeatures--  
       可选参数,类型:字符串。用来描述对话框的外观等信息,可以使用以下的一个或几个,用分号“;”隔开。  
       1.dialogHeight    :对话框高度,不小于100px,IE4中dialogHeight    和    dialogWidth    默认的单位是em,而IE5中是px,为方便其见,在定义modal方式的对话框时,用px做单位。  
       2.dialogWidth:    对话框宽度。  
       3.dialogLeft:    离屏幕左的距离。  
       4.dialogTop:    离屏幕上的距离。  
       5.center:    {yes    |    no    |    1    |    0    }:窗口是否居中,默认yes,但仍可以指定高度和宽度。  
       6.help:    {yes    |    no    |    1    |    0    }:是否显示帮助按钮,默认yes。  
       7.resizable:    {yes    |    no    |    1    |    0    }    [IE5+]:是否可被改变大小。默认no。  
       8.status:    {yes    |    no    |    1    |    0    }    [IE5+]:是否显示状态栏。默认为yes[    Modeless]或no[Modal]。  
       9.scroll:{    yes    |    no    |    1    |    0    |    on    |    off    }:指明对话框是否显示滚动条。默认为yes。  
       下面几个属性是用在HTA中的,在一般的网页中一般不使用。  
       10.dialogHide:{    yes    |    no    |    1    |    0    |    on    |    off    }:在打印或者打印预览时对话框是否隐藏。默认为no。  
       11.edge:{    sunken    |    raised    }:指明对话框的边框样式。默认为raised。  
       12.unadorned:{    yes    |    no    |    1    |    0    |    on    |    off    }:默认为no。  
       
       参数传递:  
       1.要想对话框传递参数,是通过vArguments来进行传递的。类型不限制,对于字符串类型,最大为4096个字符。也可以传递对象,例如:  
       -------------------------------  
       parent.htm  
       <script>  
       var    obj    =    new    Object();  
       obj.name="51js";  
       window.showModalDialog("modal.htm",obj,"dialogWidth=200px;dialogHeight=100px");  
       </script>  


       modal.htm  
       <script>  
       var    obj    =    window.dialogArguments  
       alert("您传递的参数为:"    +    obj.name)  
       </script>  
       -------------------------------  
       2.可以通过window.returnValue向打开对话框的窗口返回信息,当然也可以是对象。例如:  
       ------------------------------  
       parent.htm  
       <script>  
           str    =window.showModalDialog("modal.htm",,"dialogWidth=200px;dialogHeight=100px");  
           alert(str);  
       </script>  


       modal.htm  
       <script>  
           window.returnValue="http://www.51js.com";  
       </script>

    用window.showModalDialog 或者window.showModelessDialog打开一个模式窗口后,和父窗口的一些交互问题。
    要进行交互操作的前提,在调用showModalDialog或者showModelessDialog方法的时候,第二个参数传window,如:


    window.showModelessDialog('filename.htm',window,'dialogWidth=200px;dialogHeight=250px;')

    接下来,就是取得父窗口的一些数据和方法,这是经常会用的,父窗口取子窗口的参数一般通过returnValue就可以搞定了~


    //取得父窗口的JS变量 var
    window.dialogArguments.var;
    //获得父窗口的对象和属性
    window.dialogArguments.form1.name.value ;
    //调用父窗口的方法 fun
    window.dialogArguments.fun() ;


    但是有个问题,在子窗口中的事件响应无法调用父窗口的方法,


    <button onClick='window.dialogArguments.fun()'>调父窗口方法</button>

    注,执行上面的方法的时候,窗口会停止响应

  • 相关阅读:
    显示文件本地文件夹
    Select Dependencies选择依赖项
    搜索小技巧
    783. Minimum Distance Between BST Nodes BST节点之间的最小距离
    5. Longest Palindromic Substring 最长的回文子串
    12. Integer to Roman 整数转罗马数字
    3. Longest Substring Without Repeating Characters 最长的子串不重复字符
    539. Minimum Time Difference 最小时差
    43. Multiply Strings 字符串相乘
    445. Add Two Numbers II 两个数字相加2
  • 原文地址:https://www.cnblogs.com/hellohongfu/p/1865695.html
Copyright © 2011-2022 走看看