layui里的弹出框问题
来源:互联网 发布:c语言取反加一 编辑:程序博客网 时间:2024/06/05 19:07
首先引入对应的包,
下面这种是一种方式
layui.use('layer', function(){
var $ = layui.jquery, layer = layui.layer; //独立版的layer无需执行这一句
var othis = $(this);
//触发事件
var type = othis.data('type'),
text = othis.text();
layer.open({
title :'统计详情'
,type: 1
,zIndex:122000
,area: [width+'px',height+'px']
,offset: type
,id: 'tongjiLay'+type //防止重复弹出
,content:$('#tongjiLay')
,btnAlign: 'c' //按钮居中
,btn: ['保存','关闭']
,cancel: function (index, layero) {
layer.closeAll();
$("#tongjiLay").hide();
$("#fxtjTableDetail").hide();
}
,yes: function(index, layero){
layer.closeAll();
$("#tongjiLay").hide();
$("#fxtjTableDetail").hide();
}
,btn2: function(index, layero){
layer.closeAll();
$("#tongjiLay").hide();
$("#fxtjTableDetail").hide();
}
,offset: ['140px', '330px']
,shade: 0
});
});
其中,content里的值是在页面写了一个对应的div,
<div id="tongjiLay" ></div>
你也可以这样写:
layui.use('layer', function(){
var $ = layui.jquery, layer = layui.layer; //独立版的layer无需执行这一句
var othis = $(this);
//触发事件
var type = othis.data('type'),
text = othis.text();
layer.open({
title :'详情'
,type: 1
,area: ['340px',height+'px']
,offset: type
,id: 'chaxunLay'+type //防止重复弹出
,content:tr
,btnAlign: 'c' //按钮居中
,btn: ['关闭','保存']
,offset: ['140px', '330px']
,shade: 0
,yes: function(){
layer.closeAll();
}
});
});
这里的content的值就可以是你传入的一个字符窜,可以类似"<table><tr></tr></table>",
要提醒一句是的是,弹出框的zIndex属性类似于css里的z-index属性,所以大家知道怎么用了吧
- layui里的弹出框问题
- layui里的上传控件问题
- layui 关闭弹出框
- layui中弹出一个弹框,通过内嵌页面里的操作关掉整个弹出层窗口
- layui 弹出框中select第二次无法显示问题
- layui 弹出的封装函数
- layui 弹出层的表单提交
- [Layer] layui的弹出层用法记录
- layui里的表单元素的使用
- layui-弹出层
- layui弹出iframe
- layui前台框架的基本弹出层的使用
- JQuery插件-Layui弹出层的一个例子
- 使用layui组件的小问题1.0,
- layui 表单元素的选中问题
- layui 表单元素的选中问题
- TP5 layui 数组表格的排序问题
- h5安卓浏览器,弹出框里的输入框被输入法挡住的问题
- android Activity管理类(全局管理Activity)
- 每周荐书:SLAM、Vue2、爬虫(评论送书)
- 宽度优先搜索与深度优先搜索
- 动态库链接问题解决
- POJ 1947 Rebuilding Roads 树形dp+01背包
- layui里的弹出框问题
- 04_mysql文本协议
- 让系统更清晰——解构复杂系统的五种常用模型
- Spring mvc 单个@RequestMapping返回特定Content-Type的配置
- js进阶02、构造函数的继承者们
- java基础5
- 负载均衡之LVS+keepalived
- SDL介绍
- android 调用系统相册选取照片或者打开相机拍照获取图片,返回时回到手机桌面,然后才会跳转到当前activity