iframe嵌套的页面之间传值问题

时间:2022-09-17 12:34:27

项目中很多时候会遇到需要用 iframe 嵌套页面的情况。有时候会有这样的需求:

iframe 嵌套的页面 A ,点击之后要跳到页面 B ,但是同时还需要 A 页面中的某个属性值。

此时可以先把 A 页面的属性值赋值给最外层的父页面,然后再赋值给 B 页面。

A 页面的值赋值给最外层的父页面:

如父页面有个隐藏的button元素

<input type="button"  id="parentID" value="" />

赋值给此元素(此操作在A页面中执行):

$(parent.document.getElementById("parentID")).val( $( "A页面元素" ).attr("data-xxx") )

B页面获取到父页面的某个元素值(此操作在B页面中执行):

var transferValue = $(parent.document.getElementById("parentID")).val(  )

------------------------------------------------------------------------------------------------------------------------------------------------------------------------

方法二:

也可以采用window.location来解决,window.location获取的并不是最顶层网页中所显示出来的url,而是当前 iframe 所嵌套的页面所在的路径。

iframe嵌套的页面之间传值问题的更多相关文章

  1. js父页面和子页面之间传值

    今天和朋友一块讨论,怎样通过js在父页面和子页面之间传值的问题,总结例如以下: 需求描写叙述:父页面有多个子页面.实如今父页面点击子页面,传值到子页面. 看着非常easy,试了好久.主要纠结在怎样获取 ...

  2. Block作为property属性实现页面之间传值(代替Delegate代理与协议结合的方法)

    需求:在ViewController中,点击Button,push到下一个页面NextViewController,在NextViewController的输入框TextField中输入一串字符,返回 ...

  3. ASP&period;NET 页面之间传值的几种方式

    开篇概述 对于任何一个初学者来说,页面之间传值可谓是必经之路,却又是他们的难点.其实,对大部分高手来说,未必不是难点. 回想2016年面试的将近300人中,有实习生,有应届毕业生,有1-3年经验的,有 ...

  4. 页面中iframe中嵌入一个跨域的页面,让这个页面按照嵌入的页面宽高大小显示的方式;iframe嵌套的页面不可以编辑的问题解决方案

    <html> <head> <style> body { margin-left: 0px; margin-top: 0px; margin-right: 0px; ...

  5. iframe嵌套vue页面打开新窗口

    iframe嵌套vue页面时目录结构为下图: 此时出口文件指向index.html, 所以只需要用a标签动态拼接href, 并设置属性 target="_blank" ,即可在if ...

  6. 移动端web页面列表类上拉加载,查看详情,iframe嵌套第三方页面遇到的问题以及解决办法

    1.移动端上拉加载 网上有很多成熟的插件,比如iscroll.在这里介绍一下用jquery和js写的上拉加载方法.使用原生的去写上拉加载更多需要三个高度去做对比,以新闻类列表举例,首先需要整个dom的 ...

  7. 【ASP&period;NET MVC系列】浅谈ASP&period;NET 页面之间传值的几种方式

    ASP.NET MVC系列文章 [01]浅谈Google Chrome浏览器(理论篇) [02]浅谈Google Chrome浏览器(操作篇)(上) [03]浅谈Google Chrome浏览器(操作 ...

  8. asp&period;net页面之间传值方法详解

    asp.net中页面之间传值我们用得最多的就是get,post这两种了,其它的如session,appliction,cookie等这些相对来说少用也不是常用的,只是在特殊情况下在使用了. 1. Ge ...

  9. 使用ajax与iframe嵌套实现页面局部刷新

    使用ajax与iframe嵌套实现页面局部刷新.该javascript代码仅供参考,需按自己需要修改.​1. [代码]javascript代码 function cj_start(depname,gr ...

随机推荐

  1. 10天学会phpWeChat——第五天:实现新闻投稿功能

    在前几讲里,我们逐渐实现了自己小模块的新闻列表展示.新闻详情展示功能,现在您已经初步有能力开发一个phpWeChat小模块了,本文将在已开发的hello world模块基础上,增加一个新的功能--新闻 ...

  2. 虾皮工作室QQ群列表

    各位博友: 本群不仅仅是提供好的资料,更重要是提供平台,提供解决问题的方法和思路.求人不如求己,掌握合理的方法和方式才是不断进步的根本.看我的文档,不单单是看内容,更应该从整理的方式和角度是深思,去想 ...

  3. hadoop疑难杂症解析

    1:Shuffle Error: Exceeded MAX_FAILED_UNIQUE_FETCHES; bailing-outAnswer:程序里面需要打开多个文件,进行分析,系统一般默认数量是10 ...

  4. 利用 onload 事件监控跨站资源

    用过 CSP 的都很郁闷,上报的只有违规的站点名,却没有具体路径.这是缺陷,还是特意的设计? 显然,CSP 是为安全定制的,里面的规范自然要严格制定,否则就会带来新的安全问题.如果支持详细路径的上报, ...

  5. 普通的年轻状态机,纯C语言

    我们第一次接触到了状态机.在数字电路课程.计数器.串行奇偶校验.考了1连续报错电路 等待,两者都需要一个状态机模型.电路实现这些功能,与状态机的状态转移图.状态转移表是等价. 后.然后,我们联系了状态 ...

  6. &lbrack;BZOJ4518&rsqb;征途

    4518: [Sdoi2016]征途 Time Limit: 10 Sec  Memory Limit: 256 MB Description Pine开始了从S地到T地的征途. 从S地到T地的路可以 ...

  7. 201521123003《Java程序设计》第3周学习总结

    1. 本章学习总结 你对于本章知识的学习总结 了解和学会使用更多已有的类,如Calendar类.Math类.Arrays类等等 public.private的权限修饰 学会使用在Eclipse工具栏中 ...

  8. Mac 上 Apache Apollo 的安装与运行,和官方下载文件中 Python 实例的演示

    前不久我在 Mac 上成功安装了 mosquitto,这次我又试了试安装另一个热门的 broker —— Apache Apollo.对在 Mac 上安装 mosquitto 感兴趣的可以点击查看我的 ...

  9. input 文本框自动显示光标

    使用$("#votetitle").focus();没起作用 使用document.getElementById("votetitlechild").focus ...

  10. Java15-java语法基础(十四)抽象类

    Java15-java语法基础(十四)抽象类 一.抽象类的作用 三个类都有"执行任务"的方法,分别在这三个类中进行定义,因此需要重复编写代码,降低了程序开发效率,且增加了程序出现错 ...