今天和朋友一块讨论，怎样通过js在父页面和子页面之间传值的问题，总结例如以下：

需求描写叙述：父页面有多个子页面。实如今父页面点击子页面，传值到子页面。

看着非常easy，试了好久。主要纠结在怎样获取iframe，刚開始用document.getElementById('iframe的ID'),后来查资料才发现这样的方法仅仅是去取出了一个OBJECT,不能操作它的函数方法。后来改成window.iframes["iframe的name"],这样就能够获取子页面的整个DOM,能够操作它的函数。

1、父页面代码

<html>

<head>

<title></title>

<script type="text/javascript" >

function callChild(){

	var child_1 =window.frames["child"];

	var str = "ddddd";

	child_1.window.testJs(str);

}

function aa(str){

	alert(str);

	}

</script>

</head>

<body>

<iframe name="child" src="children.html" ></iframe>

<a onclick="callChild()">call children</a>

</body>

</html>

2、子页面代码

<html>

<head>

<title></title>

<script type="text/javascript">

	function testJs(str){

		alert(str);

	}

	function callParent(){

		var str = "vdsss";

		parent.aa(str)

	}

	</script>

</head>

<body>

<a onclick="callParent()">call parent</a>

</body>

</html>

js父页面和子页面之间传值的更多相关文章

  1. VUe.js 父组件向子组件中传值及方法

    父组件向子组件中传值 1.  Vue实例可以看做是大的组件,那么在其内部定义的私有组件与这个实例之间就出现了父子组件的对应关系. 2. 父子组件在默认的情况下,子组件是无妨访问到父组件中的数据的,所以 ...

  2. Iframe父页面与子页面之间的调用

    原文:Iframe父页面与子页面之间的调用 Iframe父页面与子页面之间的调用 专业词语解释如下:     Iframe:iframe元素是文档中的文档.     window对象: 浏览器会在其打 ...

  3. artdialog4.1.7 中父页面给子页面传值

    artdialog4.1.7中父页面给子页面传值时看了一些网友的解决方法: 在父页面声明全局变量 var returnValue=“ ”,子页面用art.dialog.opener.returnVal ...

  4. js里父页面与子页面的相互调用

    一.在页面里用 open 打开的子页面: 1.子页面调用父页面的方法,包括子页面给父页面传值: window.opener.methodName(); window.opener.methodName ...

  5. Iframe父页面与子页面之间的相互调用

    iframe元素就是文档中的文档. window对象: 浏览器会在其打开一个HTML文档时创建一个对应的window对象.但是,如果一个文档定义了一个或者多个框架(即:包含一个或者多个frame或者i ...

  6. iframe 框架 父页面与子界面之间的变量、函数、元素获取

    1.获取页面上的iframe 1-1. document.getElementById('iframeId'): 1-2. window.frames[0].window.frames['frameN ...

  7. 父页面调用子页面js的方法

    iframe子页面调用父页面javascript函数的方法今天遇到一个iframe子页面调用父页面js函数的需求,解决起来很简单,但是在chrome浏览器遇到一点小问题.顺便写一下iframe的父页面 ...

  8. layer.open中父页面向子页面传值

    1.咱先看图说话 父list.jsp 子operate.jsp实现的代码1 在父页面上完成对子页面的数据渲染 function setData(data) { var lay=layer.open({ ...

  9. js父页面和子页面相互取值

    iframe子页面与父页面通信根据iframe中src属性是同域链接还是跨域链接,通信方式也不同. 一.同域下父子页面的通信 父页面parent.html <html> <head& ...

随机推荐

  1. DoTween 部分中文文档

    前言 DOTween现在还处于 alpha,所以还有一些缺失的功能(如路径插件,附加回调和其它的tween选项),这个文档在不久的将来可能会改变. 一.术语 Tweener 一个tween控制valu ...

  2. 【Java】java注解@Transient的作用， 配合JPA中时间段的查询

    java注解@Transient的作用 @Transient标注的属性,不会被ORM框架映射到数据库中. 用于数据库表字段和java实体属性不一致的时候,标注在属性上使用. 例如时间段的查询 查询 R ...

  3. JAVA常见算法题(十七)

    package com.xiaowu.demo; //输出九九乘法表. public class Demo17 { public static void main(String[] args) { t ...

  4. Ubuntu下eclipse不能新建java项目 java project的解决办法

    在ubuntu系统中,装了eclipse,打开过,后来装了JDK,却不能新建java项目.重装了几遍eclipse也没有用. 原因分析: 之所以新建找不到java项目是因为eclipse有残留文件导致 ...

  5. C#实现在Form上截取消息的两种方法

    比较常用的是重载Form的DefWndProc方法,例如截取鼠标按下的消息: protected override void DefWndProc(ref Message m) { if ( m.Ms ...

  6. Python-爬虫-针对有frame框架的页面

    有的页面会使用frame 框架,使用Selenium + PhantomJS 后并不会加载iframe 框架中的网页内容.iframe 框架相当于在页面中又加载了一个页面,需要使用Selenium 的 ...

  7. 我的MAC可能在设置环境变量的时候设置错了，现在整个MAC的vi，ls等命令都执行不了了。

    1,在命令行中输入export PATH=/usr/bin:/usr/sbin:/bin:/sbin:/usr/X11R6/bin这样可以保证命令行命令暂时可以使用.命令执行完之后先不要关闭终端或者c ...

  8. java 实体序列化的意义

    一.序列化的意义 客户端访问了某个能开启会话功能的资源, web服务器就会创建一个与该客户端对应的HttpSession对象,每个HttpSession对象都要站用一定的内存空间.如果在某一时间段内访 ...

  9. mysql kill process解决死锁

    mysql使用myisam的时候锁表比较多,尤其有慢查询的时候,造成死锁.这时需要手动kill掉locked的process.使他释放. (以前我都是重起服务)..惭愧啊.. 演示:(id 7是我用p ...

  10. react-native 启动页（react-native-splash-screen）

    用于解决iOS和Android启动白屏问题及简单的启动页面展示 下载 react-native-splash-screen yarn add react-native-splash-screen re ...