jQuery Layer弹出层传值到父页面的实现代码


Posted in jQuery onAugust 17, 2017

目前做的项目中用到layer弹层传值,弹层输入框输入文本,点击确定按钮,父页面的树结构,会自动添加分组。

在此粘贴下代码,以后遇到,方便回忆,如有疑问请留言,或许会为您解答

jQuery Layer弹出层传值到父页面的实现代码

$(document).ready(function(){
//添加任务弹出层
addTask(); 
});
//弹出层
function addTask(){
$('[data-id="addList"]').on('click', function(){
layer.open({
type: 2,title: '添加任务',
closeBtn:1,
//maxmin: true,
shadeClose: false, //点击遮罩关闭层
area : ['15%' , '28%'],//弹层宽高
content: 'jsp/taskconf/roundConf-addList.jsp'
});
});
//关闭弹层
layerClose();
addTeam("addTeam");
addTeam("addRule");
}
//点击确定按钮,先传值到父页面,然后关闭弹层
function layerClose(){
('[data-id="saveBtn"]').click(function(){ //点击确定按钮,获取弹层输入值,传入父页面 var parentId=parent.('[data-id="saveBtn"]').click(function(){ //点击确定按钮,获取弹层输入值,传入父页面 var parentId=parent.("#leftTree_1_ul");//接收值的父页面ID
var txt = $('[data-id="team-txt"]').val();//弹出层内获取要传出的值
var str = "<li id="leftTree_9" class="level1" tabindex="0" hidefocus="true">" +
"<span id="leftTree_9_switch" class="button level1 switch center_open" treenode_switch="">" +
"<a id="leftTree_9_a" class="level1" target="_blank" title='"+txt+"'>" +
"<span id="leftTree_9_ico" class="button ico_open">" +
"<span id="leftTree_9_span" class="node_name">"+txt+"" +
"";
parentId.append(str);//传值到父页面
 //先得到当前iframe层的索引
 var index = parent.layer.getFrameIndex(window.name);  
 parent.layer.close(index); //再执行关闭 
});
}

总结

以上所述是小编给大家介绍的jQuery Layer弹出层传值到父页面,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

jQuery 相关文章推荐
为Jquery EasyUI 组件加上清除功能的方法(详解)
Apr 13 jQuery
jQuery日期范围选择器附源码下载
May 23 jQuery
jQuery 中msgTips 顶部弹窗效果实现代码
Aug 14 jQuery
jQuery实现ajax回调函数带入参数的方法示例
Jun 26 jQuery
基于 jQuery 实现键盘事件监听控件
Apr 04 jQuery
jquery登录的异步验证操作示例
May 09 jQuery
如何使用CSS3+JQuery实现悬浮墙式菜单
Jun 18 jQuery
jQuery实现全选、反选和不选功能的方法详解
Dec 04 jQuery
jQuery实现手风琴效果(蒙版)
Jan 11 jQuery
JQuery事件委托(适用于给动态生成的脚本元素添加事件)
Feb 01 jQuery
jQuery事件模型默认行为执行顺序及trigger()与 triggerHandler()比较实例分析
Apr 30 jQuery
jQuery+ThinkPHP实现图片上传
Jul 23 jQuery
jQuery条件分页 代替离线查询(附代码)
Aug 17 #jQuery
使用jquery的jsonp如何发起跨域请求及其原理详解
Aug 17 #jQuery
jQuery的时间datetime控件在AngularJs中的使用实例(分享)
Aug 17 #jQuery
jQuery实现全选、反选和不选功能
Aug 16 #jQuery
jQuery取得元素标签名称小结(附代码)
Aug 16 #jQuery
深入研究jQuery图片懒加载 lazyload.js使用方法
Aug 16 #jQuery
jQuery中each循环的跳出和结束实例
Aug 16 #jQuery
You might like
php 无限级 SelectTree 类
2009/05/19 PHP
采用PHP函数memory_get_usage获取PHP内存清耗量的方法
2011/12/06 PHP
thinkPHP导出csv文件及用表格输出excel的方法
2015/12/30 PHP
php版微信公众号自定义分享内容实现方法
2016/09/22 PHP
Docker配置PHP开发环境教程
2016/12/21 PHP
PHP实现简单的协程任务调度demo示例
2020/02/01 PHP
Extjs学习笔记之九 数据模型(上)
2010/01/11 Javascript
兼容ie、firefox的图片自动缩放的css跟js代码分享
2013/08/12 Javascript
JavaScript中的lastIndexOf()方法使用详解
2015/06/06 Javascript
轻松实现js图片预览功能
2016/01/18 Javascript
JQuery Mobile实现导航栏和页脚
2016/03/09 Javascript
vue.js 获取当前自定义属性值
2017/06/01 Javascript
Vuejs 单文件组件实例详解
2018/02/09 Javascript
webpack配置导致字体图标无法显示的解决方法
2018/03/06 Javascript
JS立即执行函数功能与用法分析
2019/01/15 Javascript
微信小程序常用的3种提示弹窗实现详解
2019/09/19 Javascript
微信小程序开发摇一摇功能
2019/11/22 Javascript
原生js实现点击轮播切换图片
2020/02/11 Javascript
浅谈Python中的私有变量
2018/02/28 Python
Python基于递归实现电话号码映射功能示例
2018/04/13 Python
python从子线程中获得返回值的方法
2019/01/30 Python
docker-py 用Python调用Docker接口的方法
2019/08/30 Python
Tensorflow读取并输出已保存模型的权重数值方式
2020/01/04 Python
Python任务调度模块APScheduler使用
2020/04/15 Python
使用Python对Dicom文件进行读取与写入的实现
2020/04/20 Python
Python 远程开关机的方法
2020/11/18 Python
基于Python-Pycharm实现的猴子摘桃小游戏(源代码)
2021/02/20 Python
html5+css3之制作header实例与更新
2020/12/21 HTML / CSS
Booking.com美国:全球酒店预订网站
2017/04/18 全球购物
家长通知书教师评语
2014/04/17 职场文书
护士上岗前培训自我鉴定
2014/04/20 职场文书
2014年光棍节活动策划方案(创意集锦)
2014/09/29 职场文书
公安局副政委班子个人对照检查材料
2014/10/04 职场文书
考试作弊检讨书1000字(5篇)
2014/10/19 职场文书
2014年酒店前台工作总结
2014/11/14 职场文书
Python可视化神器pyecharts之绘制地理图表练习
2022/07/07 Python