精华内容
下载资源
问答
  • 主要介绍了Layui弹框中数据表格中可双击选择一条数据的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
  • 之前一直用layer弹框组件一直出现这个 layer.js:2 Uncaught TypeError: i is not a function at Object.o.run (layer.js:2) at layer.js:2 at layer.js:2 at layer.js:2问题 后来发现header头部引入js和css文件调换...
  • layer.open({ type: 0, // 0(信息框,默认)1(页面层)2(iframe层)3(加载层)4(tips层),如果type: 1 整个页面为必填 ...offset: 't', // 坐标,弹框位于左或右或其它 icon: 6, // 图标 btn: ['确定', '取消']
    layer.open({
    type: 0, 
    // 0(信息框,默认)1(页面层)2(iframe层)3(加载层)4(tips层),如果type: 1 整个页面为必填
    title: '在线调试', // 标题
    content: '配置各种参数,试试效果', // 内容
    skin:'demo-class', // 样式类名
    area:['500px', '300px'], // 宽高
    offset: 't', // 坐标,弹框位于左或右或其它
    icon: 6,  // 图标
    btn: ['确定', '取消'], // 按钮,不限
    yes: () { // 按了确定按钮的回调
    console.log('按钮1回调')
    },
    btn2: () {
    console.log('按钮2回调')
    },
    btnAlign: 'c', // 按钮排列方式,有居左、居中、居右
    shade: [0.8, 'red'], // 遮罩, [透明度, 颜色], 无遮罩为0
    shadeClose: true, //  是否点击遮罩关闭
    time: 5000, // 弹框自动关闭所需毫秒
    id:'myId', // 用于控制弹层唯一标识
    anim: 1, // 弹框弹出动画, anim: -1为不显示动画
    isOutAnim: true, // 关闭动画
    maxmin:true, // 是否显示最大最小化按钮
    fixed: true, // 鼠标滚动时,层是否固定在可视区域
    resize: true, // 弹框是否允许拉伸
    resizing (layero){ // 监听窗口拉伸
      console.log('我拉伸了');
    },
    scrollbar: true, // 是否允许浏览器出现滚动条
    maxWidth: 500, // 最大宽度,当area: 'auto'时,maxWidth的设定才有效
    maxHeight: 1000, // 最大高度,当area: 'auto'时,maxHeight的设定才有效
    zIndex: 10, // 层叠顺序 
    move: '.layui-layer-title', //触发拖动的元素
    moveOut: true, // 是否允许拖拽到窗口外
    moveEnd: function(layero){}  // 拖动完毕后的回调方法,layero 为当前层的DOM对象
    tips:  [1, '#ccc'], // tips方向和颜色
    tipsMore: true, // 是否允许多个tips
    success (layero, index) { // 层弹出后的成功回调方法
      console.log(layero, index)
    },
    cancel  () {}, // 右上角关闭按钮触发回调方法
    
    })  
    
    
    展开全文
  • layui弹框

    2019-04-23 14:43:07
    http://layer.layui.com/api.html https://www.layui.com/demo/layer.html 【1】layer.open <span id="reset" onclick="uploadfile()">添加</span> function uploadfile() { //window.open(this....

    http://layer.layui.com/api.html

    https://www.layui.com/demo/layer.html

    【1】layer.open

    <span id="reset" οnclick="uploadfile()">添加</span>

    function uploadfile() {
        //window.open(this.href, '', 'width=255,height=255');
        layer.open({
            type: 2,
            skin: 'layui-layer-demo', //样式类名
            title: '',
            closeBtn: 0, //不显示关闭按钮
            anim: 2,
            area: ['680px', '380px'],
            shadeClose: true, //开启遮罩关闭
            content: 'img.html'
        });
       
    }

    layui点击按钮关闭当前页面、关闭弹窗

    <div style="position:absolute;z-index:99;background-color: rgba(0, 0, 0,0);top:10px;left:600px;width:60px;height:40px;" id="closeImg">
    
    $("#closeImg").click(function () {
            
            //关闭当前页
            var index = parent.layer.getFrameIndex(window.name);
            parent.layer.close(index);
        });

    【2】layer.prompt

    layer.prompt添加多个输入框

    layer.prompt(
                    {
                        formType: 2,
                        value: data.name,
                        title: "审核"
                    },
                function (value, index) {
                    obj.update({
                        name: value
                    });
                    layer.close(index);
                });
                $(".layui-layer-content").append("<br/><input type=\"text\" id= \"zxr\" class=\"layui-input\" placeholder=\"审核人\"/>")
    

    【3】layer.confirm

    layer.confirm标题修改

    layer.confirm('下载该文件',
                    {title:"下载"},
                    function (index) {
                    obj.del();
                    layer.close(index);
                });

    展开全文
  • layui弹框自适应大小

    2021-07-30 10:58:10
    } }, layer.open({ type: 2, title: '', shadeClose: true, shade: 0.8, area: this.setpage(), content: '/efdGzzd/toDiagnosticReport/' + id, success: function (layero, index) { var iframe = window['layui-...
    setpage: function () {
                    var wid = window.innerWidth;
                    if (wid > 600) {
                        return ['50%', '90%'];
                    } else {
                        return ['70%', '90%'];
                    }
                },
    
     layer.open({
                            type: 2,
                            title: '',
                            shadeClose: true,
                            shade: 0.8,
                            area: this.setpage(),
                            content: '/efdGzzd/toDiagnosticReport/' + id,
                            success: function (layero, index) {
                                var iframe = window['layui-layer-iframe' + index]; //得到子页面层的BODY
                                iframe.child(parentData);
                            }
                        })
    
    展开全文
  • layui 弹框icon 样式

    2021-06-07 11:12:35
    layui 弹框icon 样式 默认皮肤可以传入0-6 不指定 icon icon: 0 icon: 1 icon: 2 icon: 3 icon: 4 icon: 5 icon: 6 加载层,可以传入0-2

    layui 弹框icon 样式

    默认皮肤可以传入0-6

    不指定 icon

    在这里插入图片描述

    icon: 0

    在这里插入图片描述

    icon: 1

    在这里插入图片描述

    icon: 2

    在这里插入图片描述

    icon: 3

    在这里插入图片描述

    icon: 4

    在这里插入图片描述

    icon: 5

    在这里插入图片描述

    icon: 6

    在这里插入图片描述

    加载层,可以传入0-2

    展开全文
  • 1.layer.open打开一个页面,利用layer.CloseAll()关闭页面, ...// 关闭弹框 closePage:function(){ layer.closeAll(); //关闭全部弹框 }, // 打开请输入数量的页面 pageOpenNum:function(id,nu
  • layui 弹框页面

    2020-08-03 17:20:31
    function XadminOpen(title,url,w,h,full) {//弹框 if (title == null || title == '') { var title=false; }; if (url == null || url == '') { var url="404.html"; }; if (w == null || w == '') {
  • 我这个select有点特殊,不是...div class="layui-form-item"> <label class="layui-form-label">身份:</label> <div class="layui-input-block"> <select id="Role" name="Role" sty
  • layui 弹框外观美化

    千次阅读 2020-02-17 12:51:47
    layui前端框架以其便利易上手且拥有众多插件著称。今天准备对layui弹框做一个外观美化。
  • js var index = layer.open({ title: '----', skin: "layui-layer-molv", //主要代码 skin可自定义样式 type: 2, area: ['80%', '80%'], scrollbar: false, content: ".......",
  • skin: 'layui-layer-rim', //加上边框 title: "修改", area: ['420px', '200px'], //宽高 content: $(".content"), success: function () { $(':focus').blur();//解决弹框越来越黑问题 } });
  • layui弹框提示层:倒计时(layui-font-red颜色定义) 官方文档:https://layer.layui.com/ 效果图 · 截图示下: 以上就是关于“ layui弹框提示层:倒计时(layui-font-red颜色定义) ”的全部内容。
  • 实现layui弹框的x号隐藏

    千次阅读 2020-10-16 13:34:58
    layui.use(['form', 'layedit', 'laydate'], function () { var form = layui.form , layer = layui.layer , layedit = layui.layedit , laydate = layui.laydate; $ = layui.$; layer.o
  • 格式如下 ... layui.use([ "laytpl "], function () { var laytpl = layui.laytpl; var getTpl = showArticle.innerHTML; //showArticle 为模板id laytpl(getTpl).render({ data:data]}, function
  • layer.open({ type: 2, title: '公告详情', shadeClose: true, max... layer.style(index, { // 重新居中的样式 top: (layui.$(window).height() - layui.$(layero).height()) / 2 }) } });
  • layui弹框自己定按钮关闭弹框

    千次阅读 2020-11-26 13:44:02
    layui自己定义按钮关闭layui的弹窗 function closeWindow(){//关闭弹出层事件 var index=parent.layer.getFrameIndex(window.name); parent.layer.close(index); } 在使用的地方调用上面的方法即可自定义按钮关闭...
  • 上传文件的时候需要先弹出一个层再选择文件进行上传,发现layui.upload上传一次或者关闭弹框之后在不刷新页面的前提下不会执行choose方法了; 原因可能是upload.render方法执行一次之后,第二次没有把elem指定的这...
  • 效果图 父窗口打开子窗口并传值 type-可传入的值有:0(信息框,默认)1(页面层)2(iframe层)3(加载... skin: 'layui-layer-molv', title: "账单列表", // closeBtn: 0, //不显示关闭按钮 anim: 2, ar...
  • layui弹框文件导入

    2019-09-30 23:51:57
    lr.ajax({ type : "post", data :formFile, url : importUrl, contentType: false,// 且已经声明了属性enctype...
  • layui 弹框无法显示

    千次阅读 2018-11-06 20:52:03
    研究了2个小时发现 layui 弹出框一直无法显示  触发了弹框 js也没报错  function openLogin(){ var index =layer.open({ type: 1 ,title: false //不显示标题栏 ,closeBtn: false ,area: ['450px', '509...
  • layui弹框的简单使用

    千次阅读 2019-04-17 11:11:52
    layui弹框的简单使用 1.准备工作 首先去http://layer.layui.com/去下载layer插件: 然后解压,找到layer文件夹copy到你的开发环境中图片如下: Jquery要求1.8以上,在引入layer.js就可以用了。 <script...
  • layui弹框的最大最小化

    千次阅读 2020-07-07 15:07:28
    layui官网文档: 然后我将代码改成: layer.open({ title : "title", type : 1, area : ["500px","300px" ], //设置弹框的长宽 maxmin : false, //去掉最大化 content : "hello", }); 项目使用了热部署,...
  • layui弹框确认及取消按钮

    千次阅读 2019-08-23 16:50:42
    1.取消按钮 function btn1() { layer.closeAll(); } 2.确认按钮 function btn() { layui.use('layer', function(){ var layer = layui.layer; layer.open({ title:"筛选条件", ...
  • 如图为layui写的弹框,里面的下拉框选项多的时候会出现滚动条,外侧也会出现滚动条,而且下拉框选项显示不全: html: <form class="layui-form layui-form-pane" id="saveSceneModal" style="display: ...
  • 点击layui弹框的关闭按钮同时也把选项卡关闭,该怎么实现呢??? 控制选项卡关闭按钮的是 lay-allowClose="true" 属性。 ![图片说明](https://img-ask.csdn.net/upload/201912/03/1575361317_71741.png)
  • layui 弹框

    2019-09-06 22:26:20
    1:先下载layui源码资源,把下载layui源码资源引入到web项目里面 2:在把layui源码资源以这样的方式添加到项目中去,引入之后最重要的一步就是,找到正确的路径,路径不对会加载错误。 3:的方式引进去all的意识...
  • 我在博客园记录过layui关于弹框关闭问题,文章为layui关闭弹出层,这次出现了特殊情况,之前是通过layer.closeAll()解决了这个问题,但是这次解决不了。而换成parent.layer.closeAll()问题就迎刃而解。 转载于:...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 2,289
精华内容 915
关键字:

layui弹框