首页 > 其他分享 >如何实现layer双层弹窗子页面向父页面传递数据

如何实现layer双层弹窗子页面向父页面传递数据

时间:2023-03-21 12:33:22浏览次数:40  
标签:body layer var 传递数据 layero find 页面

如何实现layer双层弹窗子页面向父页面传递数据

方式1:

layer.open({
			  type: 2
			  ,title: '详细'
			  ,content: 'layerWindow/detail.html'  //需要打开的页面链接
			  ,maxmin: true
			  ,area: ['500px', '450px'],
				success: function(layero, index){
          			  var body = layer.getChildFrame('body',index);			//建立父子联系
         				  var iframeWin = window[layero.find('iframe')[0]['name']];
						// iframeWin.method();   //这句话的意思是可以通过ifarmeWin调用子页面的方法
						//		console.log(body.html()) 					//得到iframe页的body内容
						//		body.find('input').val('Hi,我是从父页来的')
						var inputList = body.find('input');     			//取得子页面中input输入框
						//var dataLists= [1000,11111,11,1333,1,1,1,1,1,1,1,1,1,11,,11,1,1];测试数组
						 for(var j = 0; j< inputList.length; j++){			//把父页面的数据放到子页面的input框中
                				body.find(inputList[j]).val(dataLists[j]);
           			}
				}
			}); 

在此方式中由于使用若依框架使用的content是接口传导的导致获取不到其子页面内容,而后我使用获取当前弹出口的方式直接获取layero得到iframe中的内容:

function cron() {
        var url = 'system/rule/cron';
        var height = $(window).height() - 50;
        top.layer.open({
            maxmin: true,
            title: "Cron表达式生成器",
            type: 2,
            area: ['800px', height + "px"], //宽高
            shadeClose: true,
            content: url,
            btn: ['确定','取消'],
            btn1:function (index,layero){
                var cron = $(layero).find('iframe').contents().find("#cron")[0].value;   //******
                $('#corn').val(cron);
                console.log(cron)
                parent.layer.close(index);
            },
            btn2:function(index,layero){
                parent.layer.close(index)
            }
        });
    }

标签:body,layer,var,传递数据,layero,find,页面
From: https://www.cnblogs.com/zhaiew/p/17239572.html

相关文章

  • idea不同页面多开项目
         ......
  • 【Unity3D】VideoPlayer组件
    1简介​AudioSource组件中介绍了音频的播放,本文将介绍基于VideoPlayer组件实现视频播放。​VideoPlayer属性面板如下:Source:视频源类型,有2种类型:VideoC......
  • idea创建maven项目默认访问页面的修改
    在web.xml文件中的<web-app标签>之间加入代码<welcome-file-list> <welcome-file>这儿写你要显示的页面名称</welcome-file></welcome-file-list>之后就能跳转到对应的......
  • 记录--两行CSS让页面提升了近7倍渲染性能
    这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助前言对于前端人员来讲,最令人头疼的应该就是页面性能了,当用户在访问一个页面时,总是希望它能够快速呈现在......
  • H.265播放器EasyPlayer使用electron打包后不能播放的问题排查与解决
    EasyPlayer流媒体播放器可支持H.264与H.265视频播放,并且还能支持网页实时视频录像以及能在iOS上实现低延时的直播。播放器性能稳定、播放流畅,可支持的视频流格式有RTSP、RT......
  • 盒子模型——页面布局的灵魂
       ......
  • curl用法:如何返回页面状态码 status code
    利用Shell测试用例时需要检测url的状态是否为 200,如果是200则正常,404/500则出现问题,需要检查。$curl-sIL-w"%{http_code}\n"-o/dev/nullhttps://baidu.com20......
  • ng-alain 创建页面
    ​​ng-alain创建页面​​ ​​https://ng-alain.com/cli/generate/zh​​​​https://ng-alain.com/docs/new-page/zh​​默认情况下,创建模块trade,创建在目录sr......
  • python+playwright 学习-35.获取页面的完整 HTML 内容
    前言selenium里面有个driver.page_source可以获取整个html页面的内容,playwright里面也有类似的方法使用page.content()page.content()获取html内容使用示例fromp......
  • 地铁线路——页面
    今天我们对地铁乘坐系统的代码进行了一个初步的编写,我完成了系统中最简单的两个功能,查找线路上的所有站点,查看该站点在那几个线路上,小王完成了系统的总页面,页面十分高级好......