浅谈layer的iframe弹窗给里面的标签赋值的问题


Posted in Javascript onNovember 10, 2016

说到这一篇,真的是颠覆了我的思维。

官方文档,没有介绍这一部分的操作,大致上提了一下。

我的思路是把页面的数据传过去,在iframe弹窗的页面拿到接收到的数据,然后赋值,但是这样就会有个问题,

怎么传值呢?

想到了url传参,但是我的数据太长了,这样不保险。

第二种动作方法去数据库读取,然后在传递,可是我实在是不想已经有的数据还去一次数据库,那不是浪费性能么,

然后询问了无数群友,才有了这个方法

先上效果图

浅谈layer的iframe弹窗给里面的标签赋值的问题

然后上代码

function editUser(i) { //编辑按钮的方法
    var rows = $("#userGrid").datagrid("getRows");
    layer.open({
      title: false,
      type: 2,
      closeBtn: false,
      area: ['420px', '560px'],
      skin: 'layui-layer-rim', //加上边框
      content: ['/Admin/ShowForm/EditUserInfo', 'no'],
      success: function (layero, index) {
        var body = layer.getChildFrame('body', index); //巧妙的地方在这里哦
        body.contents().find("#userName").val(rows[i].UserName);
        body.contents().find("#mail").val(rows[i].MailBox);
        if (rows[i].Tel != "-") {
          body.contents().find("#tel").val(rows[i].Tel);
        }
        if (rows[i].Mobile != "-") {
          body.contents().find("#mobile").val(rows[i].Mobile);
        }
        body.contents().find("#addr").val(rows[i].Addr);
        body.contents().find("#isstutas").val(rows[i].IsStatus);

      }
    });
  }

先得到整个页面,然后把id拿出来一个个赋值是不是很好呢!

以上就是小编为大家带来的浅谈layer的iframe弹窗给里面的标签赋值的问题全部内容了,希望大家多多支持三水点靠木~

Javascript 相关文章推荐
很多人都是用下面的js刷新站IP和PV
Sep 05 Javascript
onbeforeunload与onunload事件异同点总结
Jun 24 Javascript
jquery简单的拖动效果实现原理及示例
Jul 26 Javascript
jquery中prop()方法和attr()方法的区别浅析
Sep 06 Javascript
JavaScript作用域链示例分享
May 27 Javascript
js实现透明度渐变效果的方法
Apr 10 Javascript
简单理解Vue条件渲染
Dec 03 Javascript
JavaScript 跨域之POST实现方法
May 07 Javascript
浅析前端路由简介以及vue-router实现原理
Jun 01 Javascript
JavaScript实现数组全排列、去重及求最大值算法示例
Jul 30 Javascript
nuxt静态部署打包相对路径操作
Nov 06 Javascript
原生JS实现拖拽功能
Dec 16 Javascript
微信小程序 删除项目工程实现步骤
Nov 10 #Javascript
实现easyui的datagrid导出为excel的示例代码
Nov 10 #Javascript
easyui导出excel无法弹出下载框的快速解决方法
Nov 10 #Javascript
VueJS全面解析
Nov 10 #Javascript
JavaScript中如何使用cookie实现记住密码功能及cookie相关函数介绍
Nov 10 #Javascript
easyui中combotree循环获取父节点至根节点并输出路径实现方法
Nov 10 #Javascript
基于jQuery和Bootstrap框架实现仿知乎前端动态列表效果
Nov 09 #Javascript
You might like
PHP中nowdoc和heredoc使用需要注意的一点
2014/03/21 PHP
PHP @ at 记号的作用示例介绍
2014/10/10 PHP
php实现session自定义会话处理器的方法
2015/01/27 PHP
WordPress用户登录框密码的隐藏与部分显示技巧
2015/12/31 PHP
YII2框架中日志的配置与使用方法实例分析
2020/03/18 PHP
php设计模式之正面模式实例分析【星际争霸游戏案例】
2020/03/24 PHP
js对象与打印对象分析比较
2013/04/23 Javascript
JS 清除字符串数组中,重复元素的实现方法
2016/05/24 Javascript
如何解决手机浏览器页面点击不跳转浏览器双击放大网页
2016/07/01 Javascript
浅谈Cookie的生命周期问题
2016/08/02 Javascript
关于javascript中限定时间内防止按钮重复点击的思路详解
2016/08/16 Javascript
js实现将json数组显示前台table中
2017/01/10 Javascript
jQuery基于ajax实现页面加载后检查用户登录状态的方法
2017/02/10 Javascript
浅析node Async异步处理模块用例分析及常用方法介绍
2017/11/17 Javascript
JS运动特效之同时运动实现方法分析
2018/01/24 Javascript
用npm-run实现自动化任务的方法示例
2019/01/14 Javascript
vue配置font-awesome5的方法步骤
2019/01/27 Javascript
jquery中为什么能用$操作
2019/06/18 jQuery
vue如何实现动态加载脚本
2020/02/05 Javascript
关于vue属性使用和不使用冒号的区别说明
2020/10/22 Javascript
Python操作sqlite3快速、安全插入数据(防注入)的实例
2014/04/26 Python
python日期相关操作实例小结
2019/06/24 Python
pytorch GAN伪造手写体mnist数据集方式
2020/01/10 Python
俄罗斯大型在线书店:Читай-город
2019/10/10 全球购物
工业自动化专业毕业生推荐信
2013/11/18 职场文书
复核员上岗演讲稿
2014/01/05 职场文书
大学生涯自我鉴定
2014/01/16 职场文书
党组织公开承诺书
2014/03/29 职场文书
实习生岗位职责
2014/04/12 职场文书
《冬阳童年骆驼队》教学反思
2014/04/15 职场文书
淘宝店策划方案
2014/06/07 职场文书
2014最新离职证明范本
2014/09/12 职场文书
思想品德评语大全
2014/12/31 职场文书
高中教师个人工作总结
2015/02/10 职场文书
前台接待岗位职责范本
2015/04/03 职场文书
行为规范主题班会
2015/08/13 职场文书