Layer弹出层动态获取数据的方法


Posted in Javascript onAugust 20, 2018

前一阵子做了一个简单的小项目,用到了Layer弹出层(弹出层的用法就不多加赘述了,官网上都有详细的介绍,这里附上网址http://layer.layui.com/),当时前后台合页面的时候就出现了一个问题,弹出层总是获取不到数据,不过后面还是和同学们一起解决了,希望能帮助到大家。

之前的代码:

<a id="func11" onclick="func11();">点击查看</a>
function func11() {
  console.log($.cookie("id"));
  //iframe窗
  layer.open({
   type: 2,
   title: false,
   shade: [0.5],
   title: '商品简介',
   shadeClose: true,
   shade: 0.5,
   skin:'demo-class',
   maxmin: true, //开启最大化最小化按钮
   area: ['1000px', '660px'],
   shift: 2,
   content: 'product.jsp?id=<%=rs.getInt(“id”)%>', //iframe的url,
  });
}

错误:id号传不过去,页面跳转之后接收的id不正确,所以显示的页面不正确。

错误原因:变量的作用域有问题。在上面的rs不能传到func11()方法里面,所以传递的参数有问题。

解决方法:在func11()函数中添加一个参数,将id这个参数在点击事件里添加进去。

修改后的代码:

<a id="func11" onclick="func11(<%=rs.getInt(“id”)%>);">点击查看</a>
function func11(x) {
  $.cookie("id",x);
  console.log($.cookie("id"))
  //iframe窗
  layer.open({
   type: 2,
   title: false,
   shade: [0.5],
   title: '商品简介',
   shadeClose: true,
   shade: 0.5,
   skin:'demo-class',
   maxmin: true, //开启最大化最小化按钮
   area: ['1000px', '660px'],
   shift: 2,
   content: 'product.jsp?id=' + $.cookie("id"), //iframe的url
  });
 }

以上这篇Layer弹出层动态获取数据的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript 二维数组的实现与应用
Mar 16 Javascript
JavaScript 类型的包装对象(Typed Wrappers)
Oct 27 Javascript
jQuery.extend 函数的详细用法
Jun 27 Javascript
node.js中的fs.readdirSync方法使用说明
Dec 17 Javascript
js实现简易垂直滚动条
Feb 22 Javascript
jquery拖动改变div大小
Jul 04 jQuery
JS获取子、父、兄节点方法小结
Aug 14 Javascript
JS实现中文汉字按拼音排序的方法
Oct 09 Javascript
浅谈Vue2.0父子组件间事件派发机制
Jan 08 Javascript
vue 路由页面之间实现用手指进行滑动的方法
Feb 23 Javascript
jQuery中可见性过滤器简单用法示例
Mar 31 jQuery
vue本地构建热更新卡顿的问题“75 advanced module optimization”完美解决方案
Aug 05 Vue.js
layui 给数据表格加序号的方法
Aug 20 #Javascript
解决LayUI表单获取不到data的问题
Aug 20 #Javascript
Layui数据表格之获取表格中所有的数据方法
Aug 20 #Javascript
解决layui上传文件提示上传异常,实际文件已经上传成功的问题
Aug 19 #Javascript
解决layui中table异步数据请求不支持自定义返回数据格式的问题
Aug 19 #Javascript
Vue常用指令详解分析
Aug 19 #Javascript
使用layui 渲染table数据表格的实例代码
Aug 19 #Javascript
You might like
phpmyadmin的#1251问题
2006/11/25 PHP
php中的MVC模式运用技巧
2007/05/03 PHP
php中的三元运算符使用说明
2011/07/03 PHP
thinkphp验证码的实现(form、ajax实现验证)
2016/07/28 PHP
php微信扫码支付 php公众号支付
2019/03/24 PHP
共享自己写一个框架DreamScript
2007/01/20 Javascript
javascript 框架小结 个人工作经验
2009/06/13 Javascript
JQuery的一些小应用收集
2010/03/27 Javascript
jQuery EasyUI API 中文文档 - Tree树使用介绍
2011/11/19 Javascript
jquery prop的使用介绍及与attr的区别
2013/12/19 Javascript
jquery移动点击的项目到列表最顶端的方法
2015/06/24 Javascript
JavaScript编程中的Promise使用大全
2015/07/28 Javascript
JavaScript学习笔记之取数组中最大值和最小值
2016/03/23 Javascript
AngularJS打开页面隐藏显示表达式用法示例
2016/12/25 Javascript
基于vue开发的在线付费课程应用过程
2018/01/25 Javascript
从0到1构建vueSSR项目之路由的构建
2019/03/07 Javascript
了解javascript中let和var及const关键字的区别
2019/05/24 Javascript
微信小程序tab左右滑动切换功能的实现代码
2021/02/08 Javascript
[03:12]完美世界DOTA2联赛PWL DAY7集锦
2020/11/06 DOTA
跟老齐学Python之玩转字符串(3)
2014/09/14 Python
Python正则抓取新闻标题和链接的方法示例
2017/04/24 Python
python中ASCII码和字符的转换方法
2018/07/09 Python
使用TFRecord存取多个数据案例
2020/02/17 Python
美味咖啡的顶级烘焙师:Cafe Britt
2018/03/15 全球购物
Hoka One One法国官网:美国专业跑鞋品牌
2018/12/29 全球购物
李维斯牛仔裤英国官方网站:Levi’s英国
2019/10/10 全球购物
俄罗斯小米家用电器、电子产品和智能家居商店:Poood.ru
2020/04/03 全球购物
俄罗斯隐形眼镜和眼镜在线商店:Cronos
2020/06/02 全球购物
医院总经理职责
2013/12/26 职场文书
初中高效课堂实施方案
2014/02/26 职场文书
年度安全生产目标责任书
2014/07/23 职场文书
小学校长汇报材料
2014/08/20 职场文书
新党章心得体会
2014/09/04 职场文书
创业计划书之网吧
2019/10/10 职场文书
Python基础之赋值,浅拷贝,深拷贝的区别
2021/04/30 Python
警用民用对讲机找不同
2022/02/18 无线电