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

js实现子页面向父页面传值

    博客分类:
  • js
阅读更多

1、父页面father.html

 

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    
    <title>将值返回父页面</title>
 <script type="text/javascript">
     function acceptValueFromSon()
    {         

             window.open ('son.html','','status=no,scrollbars=no,top=20,

              left=110,width=420,height=165');
     }

 </script>
  </head>
 
  <body>
   <input type="text" name="elementName" id="elementName"/>
   <input type="button" value="跳到子页面" onclick="acceptValueFromSon();"/>
  </body>
</html>

 

2、子页面son.html

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    
    <title>将值返回父页面</title>
 <script type="text/javascript">
     function returnValueToFather()
     {
         var ValueToFather=document.getElementById("preturnValue").value;
         window.opener.document.getElementById("elementName").value=ValueToFather;
         window.close();
     }

 </script>
  </head>
 
  <body>
   <input type="text" name="preturnValue" id="preturnValue"/>
   <input type="button" value="提交" onclick="returnValueToFather();"/>
  </body>
</html>

 

 

 

 

 

分享到:
评论

相关推荐

    JavaScript实现在页面间传值的方法

    总结来说,本文档详细介绍了几种基于JavaScript在页面间传递参数的实现方法,适用于那些希望减少服务器交互而采用前端技术来增强用户体验的场景。这些方法包括通过URL重定向传递参数、使用隐藏表单字段传递参数以及...

    easyUi弹出window窗口传值与调用父页面的方法,子页面给父页面赋值

    在EasyUI中,我们可能会遇到需要在弹出窗口(子页面)与父页面之间进行数据传递或调用父页面方法的需求。下面将详细讲解这个过程。 首先,让我们理解标题中的“弹出window窗口传值”。在EasyUI中,创建一个弹出窗口...

    iframe子向父传值实例.rar

    总的来说,`iframe`子向父页面传值是一个常见的需求,尤其是在处理跨域问题时。通过学习和实践这个实例,开发者不仅可以掌握一种实用的技术,还能加深对Web安全和浏览器限制的理解,提升自己的开发技能。

    .NET中利用js让子窗体向父页面传值的实现方法.docx

    总结一下,.NET中利用JavaScript实现子窗体向父页面传值的步骤如下: 1. 在子页面C#后台中,创建一个方法,如`SetValueToParentPage`,生成JavaScript代码,将需要传递的值赋给`window.returnValue`,并关闭子窗口...

    JS父页面与子页面相互传值方法

    JavaScript(JS)是一种广泛用于网页和网络应用的脚本语言,尤其在处理页面交互和数据传递方面发挥着重要作用。在多页面应用或者嵌入式框架(如iframe)中,经常需要进行父页面与子页面之间的数据交换。下面将详细...

    Jquery子页面获取父页面元素,子页面向父页面添加元素

    父页面动态的获取子页面的元素,以及弹出子页面的时候获取父页面的元素;

    js中用open方式打开新窗口向父窗口传值

    在JavaScript中,使用`window.open()`方法可以打开一个新的浏览器窗口,这个方法可以实现子窗口向父窗口传值的操作。下面我们来详细解释这个过程。 首先,让我们回顾一下`window.open()`方法的基本用法。`window....

    子父窗口传值

    在这个场景中,"子父窗口传值"指的是在同一个Web应用中,子页面(通常是弹出窗口或iframe)向父页面传递数据,或者父页面向子页面传递数据,以实现特定的功能交互,而这种交互通常是为了避免不必要的后台通信,提高...

    子窗口传值到父窗口.rar

    这个过程就称为“子窗口传值到父窗口”。在JavaScript中,我们可以利用多种方法实现这一功能。以下是一些常用的技术和步骤: 1. **使用window.opener属性**: - 子窗口可以通过`window.opener`属性访问父窗口的...

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

    本文将深入探讨如何在JavaScript中实现父窗口与子窗口之间的数据传递。 首先,我们需要理解“父窗口”和“子窗口”的概念。在浏览器环境中,一个窗口可以打开另一个窗口,前者称为父窗口,后者称为子窗口。例如,一...

    微信小程序中子页面向父页面传值实例详解

    本实例将详细讲解如何在微信小程序中实现子页面向父页面传递值的方法,主要涉及到页面路由、API调用以及页面对象的操作。 首先,我们需要理解微信小程序的页面生命周期。每个页面在小程序中都有自己的生命周期,...

    iframe与父页面传值(方法互调)

    首先,我们可以通过JavaScript的DOM(Document Object Model)接口来实现`iframe`与父页面之间的通信。在`iframe`内的页面,我们可以使用`parent`对象来访问父页面的全局变量和函数。例如,如果在`iframe`内想要调用...

    ajax\HTML 页面与页面之间传值

    4. **使用Ajax获取数据**:父页面通过Ajax向服务器发送请求,获取所需数据,然后可以将数据存储在上述的SessionStorage或LocalStorage中,或者嵌入到HTML结构(如隐藏元素)中,供子页面加载后使用。例如: ```...

    iframe父向子传值实例.rar

    然而,由于浏览器的同源策略限制,`iframe`内的页面与包含它的父页面在不同源时,不能直接访问彼此的DOM或JavaScript变量,这就引出了"iframe父向子传值"的问题。 在标题"iframe父向值实例.rar"和描述中提到的解决...

    layer子层给父层页面元素赋值,以达到向父层页面传值的效果实例

    Layer子层给父层页面元素赋值,以达到向父层页面传值的效果实例是指在layer弹出框中,将子层的数据传递到父层页面的方法。这种方法可以在实际开发中发挥重要作用,例如在选择商家时,需要将子层的选择结果传递到父层...

    Layui实现父子页面之间值传递.zip

    当子页面处理完数据后,可能还需要将结果传递回父页面。同样,可以使用 `postMessage` 方法发送消息,然后在父页面监听 `message` 事件。例如,在子页面中: ```javascript // 假设处理完数据后,结果保存在 result...

    WEB页面传值

    页面传值有多种方法,包括JavaScript传值、ASP.NET页面传值、后台访问JS变量、JS调用后台函数和后台调用JS函数等。 一、JavaScript传值 JavaScript传值是指在页面之间使用JavaScript脚本来传递数据的方法。有一种...

    jquery实现页面之间的传值功能

    ### jQuery 实现页面之间的传值功能 #### 一、概述 在 Web 开发中,页面间的数据传递是一项基本且重要的任务。传统的表单提交方法虽然简单有效,但在用户体验上往往不尽如人意。随着 AJAX 技术的发展,利用 ...

    js实现页面与页面之间传值,js利用地址栏URL传值,利用H5 Web 存储 传值,利用JavaScript Cookie存储 传值

    本文将详细介绍JavaScript如何实现页面间传值,包括通过URL、H5 Web Storage(包括localStorage和sessionStorage)以及JavaScript Cookie来传递和存储数据。 首先,我们来看**通过URL传值**。在浏览器的地址栏中,...

Global site tag (gtag.js) - Google Analytics