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插件HighCharts绘制简单2D折线图效果示例【附demo源码】
Mar 21 jQuery
jQuery插件FusionCharts绘制2D柱状图和折线图的组合图效果示例【附demo源码】
Apr 10 jQuery
jquery平滑滚动到顶部插件使用详解
May 08 jQuery
基于jQuery实现的Ajax 验证用户名唯一性实例代码
Jun 28 jQuery
jQuery实现html table行Tr的复制、删除、计算功能
Jul 10 jQuery
jQuery实现广告条滚动效果
Aug 22 jQuery
jQuery实现的简单无刷新评论功能示例
Nov 08 jQuery
jQuery实现文件编码成base64并通过AJAX上传的方法
Apr 12 jQuery
jQuery中的类名选择器(.class)用法简单示例
May 14 jQuery
JQuery模拟实现网页中自定义鼠标右键菜单功能
Nov 14 jQuery
jQuery实现动态添加和删除input框代码实例
Mar 29 jQuery
jQuery高级编程之js对象、json与ajax用法实例分析
Nov 01 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 echo()和print()、require()和include()函数区别说明
2010/03/27 PHP
linux使用crontab实现PHP执行计划定时任务
2014/05/10 PHP
PHP获取Exif缩略图的方法
2015/07/13 PHP
如何实现php图片等比例缩放
2015/07/28 PHP
简介WordPress中用于获取首页和站点链接的PHP函数
2015/12/17 PHP
PHP的数组中提高元素查找与元素去重的效率的技巧解析
2016/03/03 PHP
thinkPHP5框架设置404、403等http状态页面的方法
2018/06/05 PHP
PHP html_entity_decode()函数讲解
2019/02/25 PHP
HTML代码中标签的全部属性 中文注释说明
2009/03/26 Javascript
jQuery 使用手册(七)
2009/09/23 Javascript
js和jquery批量绑定事件传参数一(新猪猪原创)
2010/06/23 Javascript
extjs render 用法介绍
2013/09/11 Javascript
最短的IE判断var ie=!-[1,]分析
2014/05/28 Javascript
JavaScript实现梯形乘法表的方法
2015/04/25 Javascript
JavaScript实现列表分页功能特效
2015/05/15 Javascript
第五章之BootStrap 栅格系统
2016/04/25 Javascript
js实现点击按钮弹出上传文件的窗口
2016/12/23 Javascript
vuejs绑定class和style样式
2017/04/11 Javascript
vue基于Vue2.0和高德地图的地图组件实例
2017/04/28 Javascript
vue中实现在外部调用methods的方法(推荐)
2018/02/08 Javascript
使用jQuery如何写一个含验证码的登录界面
2019/05/13 jQuery
微信小程序实现蒙版弹出窗功能
2019/09/17 Javascript
JS this关键字在ajax中使用出现问题解决方案
2020/07/17 Javascript
vue+ElementUI 关闭对话框清空验证,清除form表单的操作
2020/08/06 Javascript
Python中操作符重载用法分析
2016/04/29 Python
详解Django 中是否使用时区的区别
2018/06/14 Python
python+opencv实现霍夫变换检测直线
2020/10/23 Python
对python捕获ctrl+c手工中断程序的两种方法详解
2018/12/26 Python
纽约JewelryAffairs珠宝店:精细金银时尚首饰
2017/02/05 全球购物
执行总经理岗位职责
2014/02/03 职场文书
开学季活动策划方案
2014/02/28 职场文书
辅导员评语
2014/05/04 职场文书
党的群众路线教育实践活动党员个人剖析材料
2014/10/08 职场文书
工程技术负责人岗位职责
2015/04/13 职场文书
pytorch中的model=model.to(device)使用说明
2021/05/24 Python
jdbc中自带MySQL 连接池实践示例
2022/07/23 MySQL