父子窗口的操作有非常多的途径可以实现,如window.open(...),window.showModalDialog(...),以及iframe中嵌套页面等都可以实现,但是根据实际使用需要选用不同的方法。
1、open子窗口:用window.opener代表父窗口的window对象,这里就不再赘述
2、iframe中子页面:用window.parent代表父窗口的window对象,同样省略
3、模态子窗口:间接通过传window对象到子窗口,然后子窗口可获得父窗口的window对象,在使用中,这种方法是传值最麻烦的一种,一般可将一个属性值或者直接传window值给新开窗口来操作。下面是在我在实际运用中的一个实例:
父窗口打开模态子窗口:
<script type="text/javascript">
function openModal(){
window.param='选择试卷';
var str=window.showModalDialog("getPaperListforExam.htm",window,"dialogTop:300px;dialogLeft:200px;status:no;help:no;scroll:yes");
var strDevide='---+++---';
if(str!=null){
str1=str.slice(0,str.indexOf(strDevide));
str2=str.slice(str.indexOf(strDevide)+strDevide.length);
document.getElementById('paperId').value=str1;
document.getElementById('paperName').value=str2;
}
}
</script>
子窗口返回值:
<script type="text/javascript">
function selectPaper(var1,var2){
if(confirm('确定选择此试卷?')){
window.returnValue=var1+'---+++---'+var2;
window.self.close();
}
}
</script>
需要注意的是:returnValue除了可以是布尔值,整型值等以外还可以是个js数组,用来传递大量数据。 showModalDialog,是模态窗口,始终获得焦点,但弹出的窗体不能刷新,此弹出的窗口 里操作button,要想不弹出新窗口,需在弹出的窗口中在<head>和</head>之间加<base target="_self">。
分享到:
相关推荐
本文介绍了layer弹出子iframe层父子页面传值的实现方法,分享给大家,具体如下: 父页面获取子页面元素 格式: $("#iframeID").contents().find("#eleID") 示例代码: father.html <!DOCTYPE html> <...
通过学习和实践这些案例,开发者可以更好地掌握在ASP.NET中实现父子页面传值的技巧,从而提升Web应用的用户体验和功能完整性。 总的来说,父子页面传值是ASP.NET开发中的一个重要技能,涉及到多种技术和策略。选择...
当我们谈论“window.open父子窗口传值问题”,我们指的是在父窗口通过`window.open`创建了一个子窗口,并需要在两者之间进行数据通信的情况。 首先,让我们了解一下`window.open`的基本语法: ```javascript var ...
本教程将深入讲解如何使用 `Layui` 实现父子页面之间的值传递。 首先,我们需要了解 `Layui` 的基本用法。`Layui` 提供了一个基于 `JavaScript` 的模块化机制,通过 `layui.use()` 方法加载需要的模块,如 `layui....
本文实例讲述了JS简单实现父子窗口传值功能。分享给大家供大家参考,具体如下: 父窗口页面father.html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE&...
总的来说,实现"ie+FF通用的父子模态对话框相互传值"涉及到JavaScript的事件处理、跨窗口通信和CSS的模态设计。理解这些知识点并熟练运用,能帮助开发者创建出更好的交互体验。同时,要时刻关注浏览器的兼容性和最佳...
在JavaScript编程中,父窗口与子窗口之间的通信是一种常见的需求,特别是在构建多...在实际应用中,根据场景和安全性要求选择合适的方法进行父子窗口间的通信。同时,要确保遵循同源策略,因为跨域通信可能会受到限制。
在同源情况下,可以利用`localStorage`或`sessionStorage`进行父子页面间的通信。但是,这种方法不适用于跨域环境。 ### 5. 使用`window.name` `window.name`属性是全局的,并且在页面刷新后仍然保持,因此可以...
然而,在实际开发中,我们可能会遇到父子传值数据丢失的问题,这通常会导致组件状态不一致或者数据无法正确更新的问题。因此,本文详细探讨了解决Vue中父子传值数据丢失问题的方法,并对相关知识点进行梳理。 首先...
在JavaScript编程中,父子页面之间的通信是一个常见的需求,特别是在单页应用(SPA)或框架如Vue、React和Angular中。本篇文章将详细讲解如何在父子页面之间传递参数,并通过提供的DEMO文件(a.html、c.html、b.html...
二、页面传值问题 页面间值传递有多种方式,包括URL参数、Cookie、LocalStorage、SessionStorage、全局变量、事件触发等。以下是一些常用方法: 1. URL参数:适用于简单的值传递,通过修改或解析URL的查询字符串来...
这个问题涉及到进程通信、跨线程通信等复杂概念,这些是多任务操作系统中实现不同组件间协作的关键。下面将详细讲解这个主题。 首先,我们需要理解"窗口"在计算机术语中的含义。在大多数情况下,窗口指的是用户界面...
在 Vue 的单页面应用(SPA)开发中,父子组件之间的数据通信是常见的需求。本篇将详细讲解 Vue 父子组件如何进行值的传递。 首先,我们要理解 Vue 中组件的基本结构。组件是 Vue 应用的核心构造块,可以被复用,...
在进行父子页面通信时,必须注意安全问题。`postMessage`提供了验证`origin`的能力,以防止恶意页面注入数据。同时,由于浏览器的同源策略,跨域通信需要处理跨域资源共享(CORS)设置。 四、应用场景 - 内容嵌入:...
总的来说,JavaScript页面间传值是一个涵盖多个技术领域的主题,需要理解浏览器的工作原理、同源策略以及相关的API。通过以上介绍的这些方法,你应该能实现A页面打开B页面并返回值到A页面显示的功能。在实际开发中,...
### Vuex父子组件传值问题 在 Vue 中,父组件向子组件传递数据通常使用 `props`。然而,当数据需要在多级组件间传递或需要进行复杂的数据同步时,单纯使用 props 就显得力不从心了。这时,Vuex 可以作为全局的共享...
对于需要登录后才能访问的路由,可以创建一个`PrivateRoute`组件,它检查用户是否已登录,如果未登录则重定向到登录页面。 ```jsx const PrivateRoute = ({ component: Component, ...rest }) => ( {...rest}...
1. **窗口引用**:如果两个页面是父子关系(例如,一个是弹出的新窗口),可以通过`window.opener`或`window.parent`访问对方。 2. **窗口消息**:使用`window.postMessage`方法,两个无关联的页面可以通过事件监听...
在Vue框架中,父子组件之间的通信是日常开发中常见的需求。本文将详细解析Vue中父子组件如何进行值的传递,主要包括传递数值、传递方法和传递对象三种方式。 **一、传递数值** 在Vue中,子组件通过`props`属性接收...