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实现分页功能(含ajax请求、后台数据、附完整demo)
Apr 03 jQuery
jQuery+pjax简单示例汇总
Apr 21 jQuery
JQuery.dataTables表格插件添加跳转到指定页
Jun 09 jQuery
jQuery正则验证注册页面经典实例
Jun 10 jQuery
jQuery层级选择器_动力节点节点Java学院整理
Jul 04 jQuery
jQuery EasyUI 选项卡面板tabs的使用实例讲解
Dec 25 jQuery
jQuery实现鼠标响应式淘宝动画效果示例
Feb 13 jQuery
jQuery md5加密插件jQuery.md5.js用法示例
Aug 24 jQuery
Jquery和CSS实现选择框重置按钮功能
Nov 08 jQuery
jQuery实现的五星点评功能【案例】
Feb 18 jQuery
jQuery/JS监听input输入框值变化实例
Oct 17 jQuery
Jquery使用each函数实现遍历及数组处理
Jul 14 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实现网站插件机制的方法
2009/11/10 PHP
探寻PHP脚本不报错的原因
2014/06/12 PHP
php的ddos攻击解决方法
2015/01/08 PHP
JavaScript 节点操作 以及DOMDocument属性和方法
2007/12/06 Javascript
JS定时器实例详细分析
2013/10/11 Javascript
JS Replace 全部替换字符的用法小结
2013/12/24 Javascript
三种取消选中单选框radio的方法
2014/09/09 Javascript
完美兼容各大浏览器的jQuery仿新浪图文淡入淡出间歇滚动特效
2014/11/12 Javascript
javascript操作符&quot;!~&quot;详解
2015/02/10 Javascript
JavaScript编写推箱子游戏
2015/07/07 Javascript
JS获取下拉框显示值和判断单选按钮的方法
2015/07/09 Javascript
JavaScript与ActionScript3两者的同性与差异性
2016/09/22 Javascript
JS匹配日期和时间的正则表达式示例
2017/05/12 Javascript
nodejs批量下载图片的实现方法
2017/05/19 NodeJs
layer iframe 设置关闭按钮的方法
2019/09/12 Javascript
JS实现纵向轮播图(初级版)
2020/01/18 Javascript
详解vue 组件注册
2020/11/20 Vue.js
Python基础之函数用法实例详解
2014/09/10 Python
将字典转换为DataFrame并进行频次统计的方法
2018/04/08 Python
关于Python的一些学习总结
2018/05/25 Python
python单向循环链表原理与实现方法示例
2019/12/03 Python
matplotlib.pyplot.matshow 矩阵可视化实例
2020/06/16 Python
解决Keras的自定义lambda层去reshape张量时model保存出错问题
2020/07/01 Python
Python使用xlrd实现读取合并单元格
2020/07/09 Python
编写python代码实现简单抽奖器
2020/10/20 Python
css 元素选择器的简单实例
2016/05/23 HTML / CSS
Roxy美国官网:澳大利亚冲浪、滑雪健身品牌
2016/07/30 全球购物
旷课检讨书1000字
2014/02/14 职场文书
《狼》教学反思
2014/03/02 职场文书
洗发露广告词
2014/03/14 职场文书
学校政风行风评议工作总结
2014/10/21 职场文书
乡镇计划生育工作汇报
2014/10/28 职场文书
出国留学自荐信模板
2015/03/06 职场文书
感恩节寄语2015
2015/03/24 职场文书
节约用电通知
2015/04/25 职场文书
GO语言字符串处理函数之处理Strings包
2022/04/14 Golang