• 总结JavaScript(Iframe、window.open、window.showModalDialog)父窗口与子窗口之间的操作


    一、Iframe 篇

    //&&&&&&&&&&&&&&&&&&&&公共方法开始&&&&&&&&&&&&&&&

    //父对象得到子窗口的值

    //ObjectID是窗口标识,ContentID是元素ID

    function GetValue(ObjectID,ContentID)

    {

           var IsIE = (navigator.appName == 'Microsoft Internet Explorer')

                         if(IsIE)

                         {//如果是IE         

                                alert(document.frames(ObjectID).document.getElementById(ContentID).innerHTML);                              

                         }

                         else

                         {//如果是FF

                                 alert(document.getElementById(ObjectID).contentDocument.getElementById(ContentID).innerHTML);

                                       //FF下不支持innerText; 下面是解决方法                     

                                       //if(document.all){

                                       //  alert(document.getElementById('div1').innerText);

                                       //} else{

                                       //  alert(document.getElementById('div1').textContent);

                                       //}

                         }    

    }

    //父对象向子窗口赋值

    //ObjectID是窗口标识,ContentID是元素ID

    function SetValue(ObjectID,ContentID)

    {

    var IsIE = (navigator.appName == 'Microsoft Internet Explorer')

                  if(IsIE)

                  {//如果是IE         

                         document.frames(ObjectID).document.getElementById(ContentID).innerHTML="我是IE下通过父窗口赋值过来的";                            

                  }

                  else

                  {//如果是FF

                          document.getElementById(ObjectID).contentDocument.getElementById(ContentID).innerHTML="我是FF下通过父窗口赋值过来的";                  

                  }    

    }

    //&&&&&&&&&&&&&&&&&&&&公共方法结束&&&&&&&&&&&&&&&

          1.父窗口对子窗口操作

    刷新:

          document.getElementById("IframeID").src=document.getElementById("IframeID").src+"?_="+Math.random();

    上面这种方法有时需要对“src”属性处理一下。

    取值:

    //父窗口取子窗口的值

           GetValue("Iframe1","IframeDiv");

    赋值:

    //父窗口设置窗口元素的值;

           SetValue("Iframe1","IframeDiv");      

       2.子窗口操作父窗口

                  刷新:

               (1)、window.parent.location.href=window.parent.location.href;  

               (2)、window.parent.location.reload();

                  (3)、大家可以补充

        取值:

    alert(window.parent.document.getElementById("IframeDiv").innerHTML);    

    赋值:

    window.parent.document.getElementById("IframeDiv").innerHTML="我是从子窗口IFRAME传过来的值";

    关闭:

    window.parent.opener=null;//如果不加这句,会提示关闭询问窗口;

    window.parent.close();

    二、window.open 篇

    1.父窗口对子窗口操作

    打开:

    var win=null;

    win=window.open("Open.html","win","width=200,height=200");

    最大化:

    //窗口最大化

    function SonMaximize()

    {

           if(win&&win.open&&!win.closed)

           {

                  win.moveTo(-4,-4);

                  win.resizeTo(screen.availWidth+8,screen.availHeight+8);

           }else{

                  alert('还没有打开窗口或已经关闭');

           }

    }

    最小化:

    //窗口最小化

    function SonMinimize()

    {

           if(win&&win.open&&!win.closed)

           {

                  win.resizeTo(0,0);

                  win.moveTo(0,window.screen.width);

           }else{

           alert('还没有打开窗口或已经关闭');

           }    

    }

    关闭:

    //关闭窗口

    function CloseSon()

    {

           if(win&&win.open&&!win.closed)

           {

                  win.opener=null;

                  win.close()

           }else{

                  alert('还没有打开窗口或已关闭') ;

           }

    }

    刷新:

    //刷新

    function RefreshSon()

    {

           if(win&&win.open&&!win.closed)

           {

                  win.location.reload();

                  win.focus();

           }else{

                  alert('窗口还没有打开或已关闭');

           }

    }

    查看窗口大小:

    function ViewSonSize()

    {

           if(win&&win.open&&!win.closed)

           {

                  alert(win.document.body.clientWidth+'*'+win.document.body.clientHeight);

                  win.focus();

           }else

           {

                  alert(' 还没有打开窗口或者已关闭');

           }    

    }

    取值:

    alert(window.document.getElementById("OpenDiv").innerHTML);

    赋值:

    win.document.getElementById("OpenDiv").innerHTML="我是从父窗口中传过来的值";

    2.子窗口操作窗口

    刷新:

    window.opener.location.reload();

           //下面这种方法也可以

           //window.parent.location.href=window.parent.location.href;

    关闭本窗口:

    //关闭本窗口

    function CloseWindow()

    {     //window.opener.opener=null;

           window.close();

    }

    关闭父窗口:

    //关闭父窗口

    function CloseParent()

    {     //火狐下不起作用,如果要想起作用。用下面的方法

        //开firefox,在地址栏输入about:config      

           //找到dom.allow_scripts_to_close_windows这项并改为true

                  var IsIE = (navigator.appName == 'Microsoft Internet Explorer')

                  if(IsIE){//如果是IE            

                         window.opener.opener=null;

                         window.opener.close();

                         window.close();     

                  }else{

                         alert("火狐不能直接关闭;需要以下设置1.开firefox,在地址栏输入about:config;2.找到dom.allow_scripts_to_close_windows这项并改为true");

                  }

          

    }

    取值:

    alert(window.opener.document.getElementById("OpenDiv").innerHTML);     

    赋值:

    window.opener.document.getElementById("OpenDiv").innerHTML="我是从子窗口Open传过来的值";           

    三、模态窗口篇

    1.父窗口操作子窗口

    父窗口JS代码:

    var parValue="现在显示了父窗口中的变量值";

    var hao="郝建卫";

    function ShowDailog(PageHref,Title,Height,Width)

    {

           //--------------left位置

           //screen.availHeight声明了显示浏览器的屏幕的可用宽度

           var dleft =(screen.availHeight-Height)/2;

           //--------------top位置

           var dtop =(screen.availWidth-Width)/2;

           //---------------

    Var sRet = window.showModalDialog(PageHref,window,Title,"scrollbars=yes;resizable=no;help=no;status=no;center=yes;dialogTop=25;dialogLeft="+ dleft +";dialogTop="+ dtop +";dialogHeight="+Height+"px;dialogWidth="+Width+"px;");

           //--------return

           if (sRet =="refresh")//这种是利用返回值来刷新父页面

           {

                  window.Test="true";

                  window.location.reload();            

                  alert(window.Test);

           }

    }

    function test()

    {

           alert("模态窗口成功调用父窗口的方法");

    }

    2.模态窗口操作父窗口

    var parentWin=window.dialogArguments; 

    刷新:

           parentWin.location.reload(); 

    取值:

    alert(parentWin.document.getElementById("ShowModalDialogDiv").innerHTML)   //获取父窗口中的对象

     alert("我是从父窗口中得到的变量>>>"+parentWin.parValue);       //获取父窗口中的变量

    调用父窗口JS方法:

    parentWin.test();    //调用父窗口中的方法

    赋值:

    parentWin.document.getElementById("ShowModalDialogDiv").innerHTML="我是从子窗口ShowModalDialog传过来的值";      

    关闭本窗口:

    //关闭本窗口

    function CloseWindow()

    {

           window.parent.close();

    }

    关闭父窗口:

    //关闭父窗口

    function CloseModal()

    {    

           var IsIE = (navigator.appName == 'Microsoft Internet Explorer')

                  if(IsIE){//如果是IE            

                         window.parent.parent.close();

                         //parentWin.opener=null;如果把上面的换成这行,不能关闭父窗口,

                         parentWin.close();

                         //window.parent.parent.parent.parent.close();这个只能关闭模态窗口本身目前只在IE6下测试

                  }else{

                         alert("火狐不能直接关闭;需要以下设置1.开firefox,在地址栏输入about:config;2.找到dom.allow_scripts_to_close_windows这项并改为true");

                  }    

    }

  • 相关阅读:
    HTTP状态码
    python 连接 MySQL 数据库
    JS事件基础和绑定
    7月13号:2D的转换和过渡,动画效果设置
    JS事件流
    7月14日:JS的基础语法
    JS对表单的操作
    7月16日:DOM总结
    DOM样式表
    7月9号
  • 原文地址:https://www.cnblogs.com/afuge/p/3143363.html
Copyright © 2020-2023  润新知