js子页面获取父页面数据示例

做页面预览的时候，数据没有存入数据库，但是要打开一个页面进行预览，询问众大婶，原来是这样来做。

1、父页面


代码如下:

<input type="text" id="name" value="zhangsan"/>
<a href="a.html" target="_blank">预览</a>

2、子页面，也就是a.html获取父页面中文本框的value


代码如下:

$(function(){

console.info(window.opener.document.getElementById("name").value);
});

这样控制台中出来的则是父页面文本框的值

Don't hurry say have no choice， perhaps， next intersection will meet hope．

赞 (0)

相关推荐

  • js父页面中使用子页面的方法

    iframe是非常常用的一个html元素,如果在父页面中使用子页面的方法应该怎么写呢,下面就做一下简单的介绍. 一.父页面代码 <html> <head> <meta charset=" gb2312"> <title>父页面</title> <script type="text/javascript"> function parentFunction() { alert('function i

  • iframe子页面与父页面在同域或不同域下的js通信

    iframe子页面与父页面通信根据iframe中src属性是同域链接还是跨域链接,通信方式也不同. 一.同域下父子页面的通信 父页面parent.html 复制代码 代码如下: <html> <head> <script type="text/javascript"> function say(){ alert("parent.html"); } function callChild(){ myFrame.window.say()

  • 两个JSP页面父页面获取子页面内容的两种方法

    需求说明:两个JSP页面,父页面需要子页面的内容,但子页面是隐藏的,具体来说,子页面是一系列的模板,父页面要通过id来获取这些模板,不愿意通过<include>方式导入,因为如果模板过多,就导致整个父页面太大,加载缓慢,以下两个方案,不知有没有解决这个问题. 1.通过ajax方式 实现过程:通过ajax请求到子页面中,子页面获取参数id使用java和js变量的交互后,返回需要的模板信息 缺点:把js变量转换成java变量比较麻烦,需要使用form表单来提交,而且jsp中的java脚本是在服务器

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

    一.子页面是父页面通过window.open弹出的情况子页面要向父页面传值,只要在document前面加window.opener即可. 如: 1.父页面代码: <html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><titl

  • 嵌入式iframe子页面与父页面js通信的方法

    本文实例讲述了嵌入式iframe子页面与父页面js通信的方法.分享给大家供大家参考.具体分析如下: iframe框架中的页面与主页面之间的通信方式根据iframe中src属性是同域链接还是跨域链接,有明显不同的通信方式,同域下的数据交换和DOM元素互访就简单的多了,而跨域的则需要一些巧妙的方式来实现通信. 一.同域下父子页面的通信 父页面 parent.html: 复制代码 代码如下: <html> <head> <script type="text/javascr

  • JSP父页面传参数到子页面及接收示例

    1.父页面传参数到子页面 复制代码 代码如下: //JavaScript代码 $.ajax({ type:"POST", uri:"../student/studentInfo.action", data:{ "date":date, "stuNo":stuNo }, success:function(data){ var params = "?date="+date+"&stuNo=&q

  • JS中Iframe之间传值及子页面与父页面应用

    在js中,我们时常用到用iframe做系统框架,在子页面也,父页面之间的值传递是一个问题,下面是js获取父窗体和子窗体的对象js: 1.在iframe子页面中获取父页面的元素: a>window.parent.document这个是获取父页面document中的对象: b>如果要获取父页面js中的方法:window.parent.xxxx():xxxx()为方法: 2.在父页面中获取iframe子页面中的元素: a> 复制代码 代码如下: var child = document.get

  • 在父页面调用子页面的JS方法

    今天弄了一天了,终于在网上找到了解决办法 注意:问题是在父页面调用子页面的方法..... 父页面:parent.html 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.o

  • iframe子页面获取父页面元素的方法

    在iframe子页面获取父页面元素 代码如下: 复制代码 代码如下: $.('#objld', parent.document); 在父页面获取iframe子页面的元素 代码如下: 复制代码 代码如下: $("#objid", document.iframes('iframe').document) 或 复制代码 代码如下: $(document.getElementById('iframeId').contentWindow.document.body).html() $(docum

  • js子页面获取父页面数据示例

    做页面预览的时候,数据没有存入数据库,但是要打开一个页面进行预览,询问众大婶,原来是这样来做. 1.父页面 复制代码 代码如下: <input type="text" id="name" value="zhangsan"/> <a href="a.html" target="_blank">预览</a> 2.子页面,也就是a.html获取父页面中文本框的value 复制代

  • js 能实现监听F5页面刷新子iframe 而父页面不刷新的方法

    重点是阻止默认的刷新,这样外部页面就不刷新了,然后指定刷新iframe,我下面给出了思路 document.onkeypress = function(e){ if(e.keyCode == 116){ e.preventDefault(); //组织默认刷新 var iframeSrc = iframe.src; iframe.src = iframeSrc; } } iframe页面里再写如下: var iframeSrc = parent.iframe.src; document.onke

  • JS实现iframe中子父页面跨域通讯的方法分析

    本文实例讲述了JS实现iframe中子父页面跨域通讯的方法.分享给大家供大家参考,具体如下: 在非跨域的情况下,iframe中的子父页面可以很方便的通讯,但是在跨域的情况下,只能通过window.postMessage()方法来向其他页面发送信息,其他页面要通过window.addEventListener()监听事件来接收信息: #跨域发送信息 #window.postMessage()语法 otherWindow.postMessage(message, targetOrigin, [tra

  • Vue的route-view子页面调用父页面的函数详解

    Vue的route-view子页面调用父页面的函数详解

    目录 route-view子页面调用父页面函数 router-view解释 下面就一一来解释一下 命令视图:通常用在同时显示多个视图 route-view子页面调用父页面函数 最近写项目的时候,有一个模块需要刷新父页面最新后台数据,然后再进行操作,查询很多资料搞不懂怎么调用的,现在解决了,做个记录 vue版本为2.6 父页面template代码 <router-view  v-on:getUser="getUser" :infoArray="infoArray"

  • js中iframe调用父页面的方法

    本文实例讲述了js中iframe调用父页面的方法.分享给大家供大家参考.具体实现方法如下: 子页面调用父页面的方法在js中很容易实现.我们只需要在主页面加个函数,然后在子页面通过window.parent.方法()即可实现了 比如调用a()函数,就写成: 复制代码 代码如下: window.parent.a(); 但是我在chrome浏览器下却发现此方法无效了 复制代码 代码如下: //在父页面中调用该函数 <script> function dey() { var cards_frame=d

  • JS实现重新加载当前页面或者父页面的几种方法

    在开发过程中想要在某个时机去刷新某个固定的页面,去更新该页面某些控件的属性,比如显示隐藏.是否可点击等. 是用的主要是通过 刷新该页面, 方法如下: 方法一: 在该页面中调用: location.reload();  方法二: 在该页面调用:    locatiion.replace("NEW_URL"); 方法三: windows.location.href="NEW_URL"; 当然 也支持子页面刷新父页面的操作,但是子页面和父页面是通过HTML包含的关系,如果

  • JS与jQuery实现子窗口获取父窗口元素值的方法

    JS与jQuery实现子窗口获取父窗口元素值的方法

    本文实例讲述了JS与jQuery实现子窗口获取父窗口元素值的方法.分享给大家供大家参考,具体如下: 功能描述:父窗口有一个input,和一个button ,点击button打开子窗口,在子窗口中获取父窗口中input的值,并显示. js: 父窗口: <input type="text" name="currentProjectIDForDetail" id="currentProjectIDForDetail" disabled="

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

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

    微信小程序中子页面向父页面传值实例详解 上面一张图是编辑款项页面,下面一张图是点击了编辑款项页面中选择好友的图标后打开的子页面.这个时候点选子页面的某个好友时,需要把好友的名字传递回编辑款项父页面. 采取的方法: 从页面路由栈中直接获取和操作目标Page对象,这种方式,是通过调用小程序的API: getCurrentPages(),来获取当前页面路由栈的信息,这个路由栈中按照页面的路由顺序存放着相应的Page对象,我们可以很容易的获取到上一级页面的完整Page对象,从而使直接调用Page对象的属

  • Vue.js子组件向父组件通信的方法实例代码详解

    一.场景描述: 曾经有个电商项目,其中有个"老带新"模块,而且该模块新增的入口很多,但是新增后展示效果还不一样,当时就考虑将新增的组件单独拿出来,其实就是一个子组件向父组同步数据的过程. 当然,背景不重要了,关键是看实现的方式. 二.场景展示效果 (PS:展示效果请忽略美感) 三.如何实现 注意:Vuejs架构通过vue-cli 3.X搭建的项目,版本无所谓. 1.先看下目录体系,下图子组件放在components文件夹内,模拟子组件为itemAdd.vue,父组件视图放在views文

随机推荐