layer弹出层父子页面事件相互调用方法
更新时间：2018年08月17日 11:26:13 作者：qq_36990886
今天小编就为大家分享一篇layer弹出层父子页面事件相互调用方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
// 父页面
<body>
<a data-url="bbbb.html" id="parentIframe">小小提示层</a>
<input id="shuzhi" />
<button class="but_par">父页面</button>
</body>
<script src="../jquery-1.9.1.min.js"></script>
<script src="layer/layer.js"></script>
<script>
$(function(){
$("#parentIframe").click(function(){
var a = $(this).attr("data-url");
layer.open({
type: 2,
content: a,
success: function(layero, index){
var body = layer.getChildFrame('body', index);//获取子页面内容
var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method();
body.find("#transmit").click();//执行子页面的方法
body.find('input').val('Hi，我是从父页来的')
$(".but_par").click(function(){
alert(222);
})
}
});
})
})
// 子页面
<body>
<input id="name" value="不满意" />
<button id="transmit">给父层传值</button>
</div>
</body>
<script>
$(function(){
$(document).on("click","#transmit").click(function(){
parent.$("#shuzhi").val($("#name").val());
parent.location.reload(); 刷新父页面
//关闭layer弹出层
var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
parent.layer.close(index);
})
window.parent.$(".but_par").click();//执行父页面的事件
})
</script>
以上这篇layer弹出层父子页面事件相互调用方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
这篇文章主要介绍了JavaScript实现快速排序的方法,实例分析了javascript快速排序的相关实现技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-07-07
返回顶部是经常会见到的效果，代码比较简单，使用2个对象和一个主函数。职责明确方便复用2012-01-01
本篇文章主要介绍了js动态调用css属性的小规律及实例说明。需要的朋友可以过来参考下，希望对大家有所帮助2013-12-12
今天小编就为大家分享一篇layui框架与SSM前后台交互的方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2019-09-09
这篇文章主要给大家介绍了关于如何实现小程序与小程序之间的跳转的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-11-11
本文主要分享一下最近项目中遇到的一些javascript的业务逻辑函数,这些函数可以提成一个公用的工具函数以便于在以后的项目中进行使用,希望对大家有所帮助2023-11-11
要做一个异步登录，打算给用户做一点提示，所以就网上找了点代码，自己修改新增了一些，做了一个html+css+js的功能封装,供大家参考，需要的朋友参考下吧2017-02-02
本文将给大家详细介绍一下iframe的基本介绍与使用,iframe（内嵌框架）是 HTML 中一种用于将一个网页嵌入到另一个网页中的标签,它可以在一个页面中显示来自其他页面的内容,需要的朋友可以参考下2024-02-02
这篇文章主要介绍了JavaScript 中的 this 绑定规则详解的相关资料,需要的朋友可以参考下2023-02-02
手动轮播图，为轮播图中的一种，轮播图主要有无缝轮播，手动轮播，延迟轮播，切换轮播等等，轮播图主要用于展现图片，新出商品，词条，又能美观网页。給网页中增加动态效果。接下来通过本文给大家分享原生JS实现手动轮播图的实例代码，一起看看吧2018-11-11
最新评论