`

提交模式窗口后,刷新父窗口数据+获取frameset中各模块中数据

阅读更多

转自:http://www.iteye.com/topic/724864

 

一、提交模式窗口后,刷新父窗口数据

 

有些时间,按需求设计,一个窗口中,点击按扭,弹出模式窗口,在模式窗口中,添加完数据后(提交),关闭模式窗口,并且刷新父窗口,而恰恰模式窗口并不支持window.opener,所以无法获得父窗口,也就是说无法在关闭模式窗口后,来得到父窗口,但是可以借助showModealDialog的返回值来判断是否刷新,当调用showModealDialog时,父窗口代码会停在这一行,当弹出的模式窗口关闭时给window.returnValue赋值,再调用window.close()方法,最后submit提交,等数据提交后,会关闭了模式窗口,此时程序返回到父窗口,showModealDialog得到返回值,接下来,根据返回值即可决定是否要reload,注意:为避免打开新窗口,一定要在父窗口的<head>下加入<base target="_self" />,这样子就实现了关闭模式窗口来刷新父窗口了。

 

代码1:parent form

function showDatas(){

   var re=window.showModalDialog("url","parameter","description");

    if(re==1){

        window.location.reload();

    }

}

代码2:modal form

function subForm(){

    window.returnValue="1";

    window.close();

    document.getElementById("myForm").submit();

}

 

==========================================================================================

 

二、获取frameset中各模块中数据

 

框架编程概述 一个HTML页面可以有一个或多个子框架,这些子框架以<iframe>来标记,用来显示一个独立的HTML页面。这里所讲的框架编程包括框架的自我控制以及框架之间的互相访问,例如从一个框架中引用另一个框架中的JavaScript变量、调用其他框架内的函数、控制另一个框架中表单的行为等。

框架间的互相引用 一个页面中的所有框架以集合的形式作为window对象的属性提供,例如:window.frames就表示该页面内所有框架的集合,这和表单对象、链接对象、图片对象等是类似的,不同的是,这些集合是document的属性。因此,要引用一个子框架,可以使用如下语法: window.frames["frameName"]; window.frames.frameName window.frames[index] 其中,window字样也可以用self代替或省略,假设frameName为页面中第一个框架,则以下的写法是等价的: self.frames["frameName"] self.frames[0] frames[0] frameName 每个框架都对应一个HTML页面,所以这个框架也是一个独立的浏览器窗口,它具有窗口的所有性质,所谓对框架的引用也就是对window对象的引用。有了这个window对象,就可以很方便地对其中的页面进行操作,例如使用window.document对象向页面写入数据、使用window.location属性来改变框架内的页面等。下面分别介绍不同层次框架间的互相引用:

1.父框架到子框架的引用 知道了上述原理,从父框架引用子框架变的非常容易,即: window.frames["frameName"]; 这样就引用了页面内名为frameName的子框架。如果要引用子框架内的子框架,根据引用的框架实际就是window对象的性质,可以这样实现: window.frames["frameName"].frames["frameName2"]; 这样就引用到了二级子框架,以此类推,可以实现多层框架的引用。

2.子框架到父框架的引用 每个window对象都有一个parent属性,表示它的父框架。如果该框架已经是顶层框架,则window.parent还表示该框架本身。

3.兄弟框架间的引用 如果两个框架同为一个框架的子框架,它们称为兄弟框架,可以通过父框架来实现互相引用,例如一个页面包括2个子框架: <frameset rows="50%,50%"> <frame src="1.html" name="frame1" /> <frame src="2.html" name="frame2" /> </frameset> 在frame1中可以使用如下语句来引用frame2: self.parent.frames["frame2"];

4.不同层次框架间的互相引用 框架的层次是针对顶层框架而言的。当层次不同时,只要知道自己所在的层次以及另一个框架所在的层次和名字,利用框架引用的window对象性质,可以很容易地实现互相访问,例如: self.parent.frames["childName"].frames["targetFrameName"];

5.对顶层框架的引用 和parent属性类似,window对象还有一个top属性。它表示对顶层框架的引用,这可以用来判断一个框架自身是否为顶层框架,例如: //判断本框架是否为顶层框架 if(self==top){ //dosomething }

改变框架的载入页面 对框架的引用就是对window对象的引用,利用window对象的location属性,可以改变框架的导航,例如: window.frames[0].location="1.html"; 这就将页面中第一个框架的页面重定向到1.html,利用这个性质,甚至可以使用一条链接来更新多个框架。 <frameset rows="50%,50%"> <frame src="1.html" name="frame1" /> <frame src="2.html" name="frame2" /> </frameset> <!--somecode--> <a href="frame1.location='3.html;frame2.location='4.html'" onclick="">link</a> <!--somecode-->

引用其他框架内的JavaScript变量和函数 在介绍引用其他框架内JavaScript变量和函数的技术之前,先来看以下代码: <script language="JavaScript" type="text/javascript"> <!-- function hello(){ alert("hello,ajax!"); } window.hello(); //--> </script> 如果运行了这段代码,会弹出“hello,ajax!”的窗口,这正是执行hello()函数的结果。那为什么hello()变成了window对象的方法呢?因为在一个页面内定义的所有全局变量和全局函数都是作为window对象的成员。例如: var a=1; alert(window.a); 就会弹出对话框显示为1。同样的原理,在不同框架之间共享变量和函数,就是要通过window对象来调用。例如:一个商品浏览页面由两个子框架组成,左侧表示商品分类的链接;当用户单击分类链接时,右侧显示相应的商品列表;用户可以单击商品旁的【购买】链接将商品加入购物车。在这个例子中,可以利用左侧导航页面来存储用户希望购买的商品,因为当用户单击导航链接时,变化的是另外一个页面,即商品展示页面,而导航页面本身是不变的,因此其中的JavaScript变量不会丢失,可以用来存储全局数据。其实现原理如下:假设左侧页面为link.html,右侧页面为show.html,页面结构如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title> New Document </title> </head> <frameset cols="20%,80%"> <frame src="link.html" name="link" /> <frame src="show.html" name="show" /> </frameset> </html> 在show.html中展示的商品旁边可以加入这样一条语句: <a href="void(0)" onclick="self.parent.link.addToOrders(32068)">加入购物车</a> 其中link表示导航框架,在link.html页面中定义了arrOrders数组来存储商品的id,函数addToOrders()用来响应商品旁边【购买】链接的单击事件,它接收的参数id表示商品的id,例子中是一个id为32068的商品: <script language="JavaScript" type="text/javascript"> <!-- var arrOrders=new Array(); function addToOrders(id){ arrOrders.push(id); } //--> </script> 这样,在结帐页面或是购物车浏览页面就可以用arrOrders来获取所有准备购买的商品。框架可以使一个页面划分为功能独立的多个模块,每个模块之间彼此独立,但又可以通过window对象的引用来建立联系,是Web开发中的一个重要机制。在Ajax开发中,还可以利用隐藏框架实现各种技巧,在后面介绍Ajax实例编程时可以发现,无刷新上传文件以及解决Ajax的前进后退问题都会用到这种技术。

 

 

分享到:
评论

相关推荐

    frameSet应用 子父窗口传值

    在`frameSet`环境中,子窗口可以通过`window.parent`对象访问父窗口,实现数据传递。例如,假设有一个名为`leftFrame`的子窗口想要向名为`rightFrame`的父窗口发送消息: ```javascript // 在leftFrame中 window....

    ssh+frameset 简单实例

    在这个实例中,我们将探讨如何将这三个框架与Frameset技术结合,实现一个简单的权限跳转静态页面的功能。 首先,Spring框架是核心的依赖注入(DI)和面向切面编程(AOP)容器,它负责管理应用程序的组件,如数据库...

    frameset父页面和子页面的方法之间调用个属性的调用(页面上可以包含iframe)

    // 获取父窗口 var iframeWindow = parentWindow.frames['iframeName']; // 通过名称获取子页面的window对象 ``` 2. `contentWindow` 和 `contentDocument` 属性:这两个属性主要用于访问`iframe`的内容。`...

    ZTree+frameset+myibatis+struts2+spring整合主页面

    使用ZTree+jquery+myibatis+struts2+spring做的一个系统主页面, 包括树形菜单. 按照PLATFORM\src\system\database\script/script.sql可进行数据的导入。

    div+css实现frameset网页布局

    `frameset`布局在早期的网页设计中颇为流行,它允许我们将浏览器窗口分割成多个独立显示区域,每个区域可以加载不同的网页内容。然而,随着Web标准的发展,`div+css`布局因其灵活性和可维护性逐渐成为主流。 `div`...

    frameset框架中target的使用

    在这个例子中,所有的链接都将加载到名为`content`的`&lt;frame&gt;`中,除了最后一个链接,它使用了`_parent`值,这意味着它将在父`&lt;frameset&gt;`中打开。 #### 使用注意事项 虽然`frameset`提供了一种灵活的方式来组织...

    实现div 遮罩 frameset

    在这个场景中,“实现div 遮罩 frameset”意味着在`frameset`布局的网页上,使用`div`来实现一个可移动的遮罩层或弹出窗口。 首先,我们来看`frameset`。`frameset`是HTML4中的元素,它允许我们将浏览器窗口划分为...

    如何在frameset中跳转出来

    在上面的示例中,我们可以看到,开发者需要在 Frameset 中实现一个退出选项,点击退出时,整个 Frameset 应该被关闭,而不是只是上面的页面变掉。这意味着,我们需要一种能够跳出当前 Frameset 的技术。 Frameset ...

    frameset

    form表单是HTML中用于收集用户输入的重要元素,通常包括各种输入控件(如文本框、按钮、复选框等)和提交数据的action属性。9-11可能是课程或者章节编号,表明这部分内容可能是系列教程的一部分。 综合来看,相关的...

    页面布局frameset frame

    在网页设计领域,页面布局是至关重要的,它决定了用户如何与网站进行交互和获取信息。在HTML的历史发展中,"frameset" 和 "frame" 是早期用于实现多窗口或区域页面布局的技术。这些技术允许开发者将网页分割成多个...

    有关于整体刷新和局部刷新frameset窗口

    总之,整体刷新和局部刷新frameset窗口是通过JavaScript和Ajax技术实现的,它们在多frame布局的网页中提供了灵活的数据更新方式。通过正确地操作frames和利用异步通信,我们可以根据需求控制页面的刷新行为,提高...

    frameset中的页面退出的问题

    例如,可以在父页面中监听`window.onunload`事件,并在子框架中也触发相应的卸载事件。这样可以确保所有相关页面都被正确清理。 此外,由于`frameset`在HTML5中已被废弃,现代网页设计更倾向于使用CSS布局(如...

    frameset元素属性详解

    ### frameset元素属性详解 在HTML中,`frameset`元素是一种用于定义多窗口(或称为框架)布局的特殊元素,它允许在一个HTML文档中嵌入多个独立的HTML文档,从而实现网页的分屏显示。这在早期网页设计中非常流行,...

    frameset 上传文件窗口最小化(未实现)

    当我们在一个子框架(frame或iframe)中执行操作,比如文件上传,完成后通常需要将结果或数据传递回父框架(top页面),以便主页面能根据上传结果更新状态或执行后续操作。在frameset环境下,可以通过JavaScript来...

    网页跨frameSet框架菜单

    例如,当用户在下拉菜单中选择一项时,可以触发一个事件,该事件在JavaScript中设置一个全局变量或调用父窗口的函数: ```javascript // 在menu.html的下拉菜单事件处理程序中 document.getElementById('dropdown')...

    整体刷新和局部刷新frameset窗口问题深入探讨

    常见的做法是当用户在某个frame中提交数据后,通常希望更新的是数据所在的frame,而不是整个页面。 问题出现在提交数据的frame与需要更新的frame不一致时。例如,在上面描述的页面结构中,提交右边的frame...

    Asp.net中Frameset的使用小结(1)

    Asp.net 中 Frameset 的使用小结 Frameset 是一种将网页分割成多个框窗的技术,每个框窗可以显示不同的 URL。使用 Frameset 可以将一个网页分割成多个部分,每个部分可以显示不同的内容。 Frameset 的基本结构由...

    frame边框样式 frameSet样式 frameSet应用

    在网页设计领域,`frame`和`frameset`是HTML中的元素,用于创建多窗口布局,也就是我们常说的“框架页”。这些元素在早期的网页设计中被广泛使用,但随着现代网页技术如HTML5的发展,它们的使用已经逐渐减少。尽管...

    JS 表单验证 使用Frameset+Table布局(div也可)

    2 使用Frameset+Table布局(div也可) 3 对用户ID和用户名、口令不符合条件及时判断 4 对口令不一致进行及时判断 对34的及时判断,要求提示信息必须显示在同一个页面 也就是说显示在当前的行的后面或者上面或者下面 ...

Global site tag (gtag.js) - Google Analytics