JS在父页面调用iframe嵌入的子页面方法

最新推荐文章于 2023-10-24 11:24:51 发布

ycblog.top

最新推荐文章于 2023-10-24 11:24:51 发布

阅读量1.2k

点赞数

分类专栏：前端文章标签： js html

本文链接：https://blog.youkuaiyun.com/qq_41916305/article/details/118525957

版权

最近遇到需求，需要在父页面嵌入其他页面，又需要获取父页面中的字段值作为参数调用子页面的JS方法，从而改变子页面中的内容（脑壳痛！！！没办法，客户是上帝！！！）

简单记录下操作方法，方便后续使用：

父页面：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>父页面</title>
  <script&

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

ycblog.top

关注关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

微信小程序是否有路由拦截_微信小程序--路由拦截器

weixin_39849070的博客

12-21

1571

背景由于最近公司要求开发小程序,一直很感兴趣,也是趁着这次机会,边文档边开发,遇到一些好玩的东西,留此作为笔记介绍在开发小程序,构建路由时,因为需要权限判断,最常见的就是在路由跳转时判断用户是否有权限访问或使用该功能,而在官网找了很久也没有看到,诸如 vue-router 的 beforeEach 那样的路由拦截器,但是拦截是肯定需要的,所以自己写了一个代码直接上代码拦截器const appGlo...

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

10-25

在讨论iframe子页面与父页面间的JavaScript通信时，首先需要理解同域与跨域的概念。同域指的是两个页面的协议、域名和端口完全相同。跨域则是指页面的协议、域名或端口中的一个或多个不同。在同域环境下，iframe与...

参与评论您还未登录，请先登录后发表或查看评论

js+jsp+json+tomcat跨域访问

02-01

本demo为通过jquery 来进行json的跨域访问的小例子。简单易懂！

vue路由传参的两种方式,实现返回上个页面不刷新

anny_mei的博客

07-17

1万+

我的项目是当在新增页面(下面叫A页面)先提交一些数据,然后跳转到下一个页面(下面叫B页面)再填写数据,然后返回到新增的页面之前我直接跳转回B页面goback(),这样的话跳转回来A页面就什么数据都没有了解决方法有两种,一种是在地址栏里面拿参数 this.$router.push({ name:'xxxxxxxxx', // 跳转的页面名称 params:{ id:this.id || "xxxxxxxxxx" } }) 在

layui框架弹出层layer.open({...})中子页面元素获取父页面中值

热门推荐

XU_RI_DONG_SHENG的博客

05-14

1万+

layui中弹出层的使用本篇文章适合小白，大神靠边站最终页面效果父页面表格的渲染弹出层页面从父页面点击按钮弹出子页面重点本篇文章适合小白，大神靠边站最终页面效果直接看代码吧 父页面表格的渲染 table.render({//页面初始化 elem : '#enterprise', page : true, method : 'POST', url : 'saleinfo/showEnterprise', title : '企业预留售票管理', cell

tips-9 layui弹窗获取父页面选中的数据

weixin_45698602的博客

07-13

363

参考链接：(9条消息) 【Layui】弹出层（从父窗口传递数据到子窗口）_张育嘉的博客-优快云博客

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

10-24

在网页开发中，有时我们需要在嵌入的iframe子页面与包含它的父页面之间进行JavaScript通信。这通常是出于功能集成或者数据交互的需求。本篇文章将详细阐述如何在同域和跨域的情况下实现这样的通信。首先，我们来看...

iframe子父页面调用js函数示例

10-26

在实际项目中，我们经常需要实现`iframe`子页面与父页面之间的交互，比如调用彼此的JavaScript函数。本文将详细介绍如何实现`iframe`子页面调用父页面的函数，以及父页面调用子页面的函数。 1. **iframe子页面调用...

vue项目实现路由跳转到新页面，返回旧页面，保留之前的数据记录

害。代码嘛，可不就是敲着玩！

08-09

5503

vue项目实现路由跳转到新页面，返回旧页面，保留之前的数据记录

vue实现路由跳转到新页面，返回旧页面，保留之前的数据记录

最新发布

qq_45801301的博客

10-24

4864

vue实现路由跳转到新页面，返回旧页面，保留之前的数据记录

iframe弹出框遮罩父类页面

08-22

iframe弹出框遮罩父类页面，进去之后直接打开demo里面的layout.html 页面看效果，然后查看代码；才方法不需要将子类的js 及弹出框的代码写在父类里面，依旧是写在子类页面里面

微信小程序--路由拦截器

03-29

实现iframe嵌套的子页面弹出框覆盖父页面案例

三日沐水

05-31

1万+

我最近开发一个项目需要用到window弹出框，前台涉及到了eaysui框架，查看了api只是告诉你window("open")和window("close"),但是打开的只是子页面里面的弹框，因此我想把这个方法记录下来。第一点：要给父iframe页面一个<div id="parentWindow"></div>第二点：在你的子页面里面来获取到这个父页面的对象获取方法是： v...

Vue返回上一页保留数据

KevinMiGuan的博客

03-09

7744

1.配置路由，代码如下 export default new Router({ routes: [ { path: '/hello', name: 'HelloWorld', component: HelloWorld, meta: { keepAlive: true // 需要缓存 } }, { path: '/hello2', name: 'HelloWorld2',

微信小程序的路由拦截

qq_46199553的博客

07-29

1925

微信小程序拦截路由器

vue router-link 返回上一页

ruanhongbiao的专栏

12-24

8730

1、如果使用了Vue-router的话，就可以用 this.$router.go（-1）实现返回； 2、如果没使用vue-router，就可以用 window.history.go（-1）实现返回效果。可以定义方法@click="goback" ethods:{ goback(){ this.$router.go(-1);/...

微信小程序 - 路由拦截

CSU_Zipple的博客

03-08

6563

参考文章：https://www.jianshu.com/p/8f33a38a671a 代码 /** * 页面路由鉴权相关 */ const isExpired = (auth) => { if (auth.token === '') return false return auth.expireTime - new Date().getTime() > 0 } con...

ifream页面弹出框遮盖层覆盖父页面

weixin_30621711的博客

05-27

726

1.首先找到子页面上遮罩层的id， 2.然后再父页面编写个js方法 1 function shade() { 2 $(".layui-layer-shade").height($(window).height()).width($(window).width()); //使遮罩的背景覆盖整个页面 3 } View Code 3.在子页面调用父页面的j...

vue-router 快速返回上一页

qq_40197100的博客

10-13

7411

this.$router.go（-1）或者 <router-link to> <el-button @click="$router.back(-1)">上一页</el-button> </router-link> 如果没使用vue-router window.history.go（-1）