`
wang_zhi_peng2007
  • 浏览: 255580 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

JavaScript父窗口与子窗口之间的交互

阅读更多
//父对象得到子窗口的值

//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();

 

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;");

       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");
   }    
}

 

<写的不错,转载中>

分享到:
评论

相关推荐

    js(javascript)子窗口和父窗口交互

    根据题目提供的信息,本文将详细介绍两种实现父窗口与子窗口交互的方法。 #### 一、通过 `window.open()` 方法实现交互 `window.open()` 是一种常见的创建新窗口的方式。通过这种方式可以灵活地控制新打开窗口的...

    javascript 父窗口、子窗口传值问题

    在JavaScript编程中,父窗口与子窗口之间的通信是一种常见的需求,特别是在构建多窗口应用程序或弹出窗口时。本文将深入探讨如何在JavaScript中实现父窗口与子窗口之间的数据传递。 首先,我们需要理解“父窗口”和...

    jsp与javascript配合,父窗口与子窗口之间刷新

    本示例探讨的是如何将JSP与JavaScript结合,实现父窗口与子窗口之间的数据通信及页面刷新功能,特别涉及了Ajax查询数据和表格渲染。以下是关于这些知识点的详细解释: 1. **JSP(JavaServer Pages)**:JSP是一种...

    JavaScript操作iframe父窗口和子窗口例子

    在Web应用程序中,iframe(Inline Frame)常用于嵌入其他网页或者实现页面的局部刷新,而父窗口与子窗口之间的通信则能实现更复杂的交互逻辑。 在JavaScript中,通过window对象我们可以访问到当前窗口的各种属性和...

    javascript经典特效---子窗口对父窗口的操作.rar

    JavaScript是一种广泛应用...总之,JavaScript提供的窗口操作能力使得子窗口与父窗口之间的通信变得可能,这对于构建动态和交互丰富的Web应用至关重要。通过深入研究这个主题,开发者能够创建更加灵活和响应式的网页。

    子窗口与父窗口刷新

    在Java Web开发中,"子窗口与父窗口刷新"是一个常见的交互场景,特别是在构建多层级界面或模态对话框时。这里的"子窗口"通常指的是弹出的窗口、框架或者iframe,而"父窗口"则是打开子窗口的那个主页面。在这样的场景...

    父窗口与子窗口间的调用

    本文将详细介绍如何使用JavaScript实现父窗口与子窗口之间的调用以及值的传递。 #### 一、基本概念 1. **父窗口**:通常指打开新窗口的原始页面。 2. **子窗口**:由父窗口通过`window.open()`方法打开的新窗口。 ...

    HTML 父窗口打开子窗口,并接收子窗口返回的值.zip

    在这个名为"HTML 父窗口打开子窗口,并接收子窗口返回的值"的示例中,我们主要探讨如何利用JavaScript在HTML页面中打开新的子窗口,并在子窗口与父窗口之间进行通信,传递数据。 首先,`index.html`很可能是主页面...

    创建子窗口与子父窗口间通信

    在DHTML手册中,可能包含了如何使用JavaScript操纵DOM元素来实现子窗口与父窗口通信的方法。 3. **IFrame通信:** - 当子窗口是页面内的IFrame时,可以通过`window.parent`访问父窗口的对象,反之亦然,只要同源...

    HTML中IFrame父窗口与子窗口相互操作

    以下将详细介绍如何在HTML中进行`&lt;iframe&gt;`父窗口与子窗口之间的交互操作。 首先,我们来看一些通用的方法: 1. **获取子窗口的值**: 使用`document.frames`对象(在IE中)或`contentDocument`属性(在非IE浏览...

    子窗口刷新父窗口总结

    `window.showModalDialog()`方法创建一个模态对话框窗口,与`window.open()`不同的是,它提供了更高级的交互方式,但不支持直接引用父窗口。因此,刷新父窗口的操作相对复杂一些。 ##### 方法一:在子窗口中刷新父...

    showModalDialog使用例子,父窗口向子窗口传递值,子窗口设置父窗口的值,子窗口关闭的时候返回值到父窗口

    在JavaScript中,`showModalDialog`是一个非常有用的函数,它允许我们打开一个新的浏览器窗口或对话框,并与父窗口进行交互。这个功能在开发过程中经常用于创建弹出式表单、确认对话框或者需要用户输入信息的场景。...

    javascript提交父窗口

    在探讨“javascript提交父窗口”这一主题时,我们需要理解几个核心概念:JavaScript 是如何与浏览器中的不同窗口进行交互的,以及如何通过 JavaScript 来操作 DOM(文档对象模型)元素,特别是如何触发表单的提交...

    子窗口向父窗口传递值

    本文将详细介绍如何在父窗口和子窗口之间传递数据,重点是“子窗口向父窗口传递值”。 首先,我们来看如何打开子窗口并传递数据。通常,我们可以使用`window.open()`函数来创建一个新的浏览器窗口。例如: ```...

    JavaScript实际应用子窗口和父窗口

    ### JavaScript 实际应用:子窗口与父窗口交互详解 在前端开发中,有时我们需要实现不同窗口之间的信息交换,比如从父窗口向子窗口传递数据,或者反过来从子窗口向父窗口返回信息。本文将通过具体示例来详细介绍...

    js父窗口跟子窗口的互刷

    在JavaScript编程中,"父窗口跟子窗口的互刷"是指在浏览器环境中,一个窗口(父窗口)与打开的新窗口(子窗口)之间进行数据交换和状态更新的技术。这种技术通常用于实现弹出窗口间的通信,例如购物车详情或者多步骤...

    父窗口调用iframe子窗口方法

    总的来说,理解和掌握如何在父窗口与`iframe`子窗口之间进行通信是Web开发中的重要技能,尤其在处理复杂页面结构和跨窗口数据交换时。通过学习和实践这些技术,开发者可以更好地构建交互丰富的Web应用。

    子父窗口传值

    - 事件触发:与子窗口向父窗口传值类似,父窗口也可以通过触发事件来传递数据给子窗口。 3. **FineUI中的子父窗口交互** - FineUI 提供了`OpenWindow`方法来创建子窗口,并且支持在打开子窗口时传递参数,这些...

    javascript打开静态子窗口

    通过上述介绍,我们可以了解到如何使用JavaScript来打开静态子窗口以及如何在父窗口与子窗口之间进行数据交互。尽管 `window.showModalDialog()` 方法已被废弃,但在实际项目中仍然可以使用其他方法和技术来实现类似...

    刷新父窗口的多种方法

    在Web开发中,经常会出现需要从子窗口或弹出窗口刷新父窗口的情况。这通常发生在使用JavaScript进行页面交互时。本文将详细介绍四种不同的方法来实现这一目标。 #### 1. 弹出子页面刷新父窗口 在打开一个新的窗口...

Global site tag (gtag.js) - Google Analytics