精华内容
下载资源
问答
  • 在使用layui的过程,有几个方法需要被多个js引用,所以我按照文档,自定义了一个layui的模块,下面实现过程 先定义一个模块 //定义模块 layui.define(['form'], function(exports){ var form = layui.form; //只有...
  • 使用layui定义一个模块并使用的实例

    万次阅读 2018-01-19 18:32:51
    在使用layui的过程,有几个方法需要被多个js引用,所以我按照文档,自定义了一个layui的模块,下面实现过程 先定义一个模块 //定义模块 layui.define(['form'], function(exports){ var form = layui.form; /...

    在使用layui的过程,有几个方法需要被多个js引用,所以我按照文档,自定义了一个layui的模块,下面实现过程

    先定义一个模块
    //定义模块
    layui.define(['form'], function(exports){
    
        var form = layui.form; //只有执行了这一步,部分表单元素才会自动修饰成功
        var $ = layui.$;
    
        var obj = {
            changeParentPlace: function (parentId,tagId,levelPlace) {
                $.ajax({
                    url:ctx + '/base/place/changeParentPlace',
                    type:'get',
                    data:{
                        parentId:parentId
                    },
                    dataType:'json',
                    success:function (data) {
                        $("#" + tagId).empty();
                        $("#" + tagId).append('<option value="">请选择</option>');
                        if(data.result != null && data.result.length != 0) {
                            $.each(data.result,function(i,place) {
                                if(levelPlace == place.name) {
                                    $("#" + tagId).append('<option selected value="'+place.id+'">'+place.name+'</option>')
                                }else {
                                    $("#" + tagId).append('<option value="'+place.id+'">'+place.name+'</option>')
                                }
                            })
                        }
                        form.render('select'); //刷新select选择框渲染
                    }
                })
            }
        }
    
        //输出模块
        exports('common', obj);
    });
    • 定义方法使用layui.define
    • define中的第一个参数可以加载一些layui中内置的模块来使用,第二个回调方法中定义一些公共的方法
    • exports的第一参数是这个模块起的名字,第二个参数是一个对象该对象中定义了这三个方法
    设置模块
    //设置模块
    layui.config({
        base: ctx + '/js/app/modules/' //假设这是你存放拓展模块的根目录
    }).extend({ //设定模块别名
        common:'common'
    });
    • 定义模块使用layui.config
    • base定义的是定义模块的js所在目录
    • common是设置的别名,’common’是目录中的文件名(.js自动加)

    //调用模块

    layui.use(['common'], function(){
        var common = layui.common;
    
        common.changeParentPlace($("#firstLevelId").val(),'secondLevelId');
    
    });
    • 先将common模块use出来,调用代码如上common.changeParentPlace($("#firstLevelId").val(),'secondLevelId');和使用内置模块是一样的
    展开全文
  • LayUI底层方法

    千次阅读 2018-11-19 17:57:20
    Layui模块化页面用法 需要即加载模块 //引入js,css文件跳过,看文档 //在页面中,如同编写JavaScript一样 &amp;lt;script&amp;gt; layui.use(['layer','form'],function(){//需要加载的模块 ...

    Layui模块化页面用法

    需要即加载模块

    //引入js,css文件跳过,看文档
    
    //在页面中,如同编写JavaScript一样
    <script>
    	layui.use(['layer','form'],function(){//需要加载的模块
            var layer = layui.layer,
            form = layui.form;//初始化模块变量
            
            layer.msg('Hi!');//调用该模块的方法
    	})
    </script>
    

    一次加载所有模块

    <script>
    	;!function(){
          var layer = layui.layer
          ,form = layui.form;//初始化模块变量
    
          layer.msg('Hello World');
        }();
    </script>
    

    自写模块

    //js文件
    layui.define(['layer'],function(exports){//自写模块需要调用的layui模块
        var layer = layui.layer;//初始化模块变量
        
        layer.msg('Hi!');
        
        exports('index',{})//导出自写模块,index为导出名,use的时候名字要和导出一致
    })
    
    //use时注意需要设定模块所在目录
    <script>
    	layui.config({
            base:'/res/js/modules/' //自建模块所在目录
    	}).use('index',function(){//加载入口
            
    	});
    </script>
    

    本地存储操作

    layui.data('test',//test表名
        {//对象
            key:'user_name',//键值对
            value:'用户1'
        }
    )
    
    //删除
    layui。data('test',{
        key:'user_name',//需要删除的键
        remove:true//删除
    })
    
    //查
    var local = layui.data('test');
    console.info(local.user_name);
    
    //根据删除的方法,我暂时认为,如果需要插入多个键值对,需要使用对象数组,而删除多个键值对,则未知了,因为没实际操作,因为本地存储其实不怎么会用这个,接入后端后大多用session或者redis
    

    各种实际可能不怎么用的底层方法

    layui.device()//获取设备信息
    layui.cache()//获得缓存
    layui.extend(options)//拓展别名,给一个模块设置别名
    layui.each(obj,fn)//对象(array,object,dom)遍历,可取代for
    layui.getStyle(node,name) //获得dom节点的style属性值,如document.body,'font-size'
    layui.img(url,callback,error)//图片预加载,可设置加载失败显示默认图从而避免图片加载失败没图的尴尬
    layui.router()//获得路由
    layui.hint()//向控制台输出异常,目前只能error,layui.hint().error('error')
    layui.stope(e)//阻止事件冒泡
    layui.onevent(modName,events,callback)//自定义模块事件
    layui.event(modName,events,params)//执行自定义事件
    layui.factory(modName)//获取模块定义时的回调函数
    
    展开全文
  • layUI使用方法

    2020-07-24 16:37:50
    一.1.layui模块化使用:如果你使用的是layui,那么你直接在官网下载layui框架即可,无需引入Query和layer.js,但需要引入layui.css和layui.js。 调用方式:通过layui.use(‘layer’,callback)加载和初始化layer模块。...

    一.1.layui模块化使用:如果你使用的是layui,那么你直接在官网下载layui框架即可,无需引入Query和layer.js,但需要引入layui.css和layui.js。
    调用方式:通过layui.use(‘layer’,callback)加载和初始化layer模块。
    在这里插入图片描述
    2.作为独立组件使用,如果你只是想使用的是layer,你可以去layer独立版本官网下载组件包。你需要在你的页面引入jQuery1.8以上的任意版本,并引入layer.js。
    调用方式:通过script标签引入layer后,直接用即可。
    在这里插入图片描述
    二.Layer简单的弹出模态窗体,title支持三种的值,若你传入的是普通的字符串,如title:’我是标题’,那么只会改变标题文本;若你还需要自定义标题区域样式,那么你可以tilte:[‘文本’,’font-size:18px;’],数组第二项可以写任意css样式;如果那你不想显示标题栏,你可以title:false。Centent内容,content可传入的值是灵活多变的,不仅可以传入普通的html内容,还可以指定DOM,更可以随着。
    type的不同而不同。例如:
    在这里插入图片描述layer弹出模态框,关闭模态框
    在这里插入图片描述
    在这里插入图片描述
    表格方法的渲染配置:cols 标题栏
    在这里插入图片描述三.tempelt自定义列模板 类型:string,默认值:无
    在默认情况下,单元格的内容是完全按照数据接口返回的conetn原样输出的,如果你想对某列的单元格添加链接等其它元素,你可以借助该参数来轻松实现。这是一个非常实用且强大的功能,你的表格内容会因此而丰富多样。
    Templet 提供了三种使用方式,请结合实际场景选择最合适的一种:
    1.如果自定义模版的字符量太大,我们推荐你采用【方式一】
    2.如果自定义模板的字符量适中,或者想更方便地调用外部方法,我们推荐你采用【方式二】
    3.如果自定义模板的字符量很小,我们推荐你采用【方式三】
    在这里插入图片描述四.事件监听
    语法:table.on(‘event(filter)’,
    callback); 注:event为内置事件名,filter为容器lay-filter设定的值
    table模块在Layui事件机制中注册了专属事件,如果你使用layui.onevent()自定义模块事件,请勿占用table名。目前所支持的所有事件见下文。
    默认情况下,事件所监听的是全部的table模块容器,但如果你只想监听某一个容器,使用事件过滤器即可。
    假设原始容器为:

    那么你的事件监听写法如下:
    在这里插入图片描述单选框事件为例
    在这里插入图片描述
    五.重置表格尺寸
    该方法可重置表格尺寸和结构,其内部完成了:固定列高度平铺、动态分配列宽、容器滚动条宽高补丁 等操作。它一般用于特殊情况下(如“非窗口 resize”导致的表格父容器宽度变化而引发的列宽适配异常),以保证表格在此类特殊情况下依旧能友好展示。
    语法:table.resize(‘ID’),其中 ID 为基础参数 id 对应的值(见:设定容器唯一ID),如:
    在这里插入图片描述
    六Height设定容器高度
    类型:Number/String,可选值如下:
    可选值 说明 示例

    1. 不填写
      说明:默认情况。高度随数据列表而适应,表格容器不会出现纵向滚动条
      示例:-
    2. 固定值
      设定一个数字,用于定义容器高度,当容器中的内容超出了该高度时,会自动出现纵向滚动条
      示例:height: 315
      3.full-差值
      说明:高度将始终铺满,无论浏览器尺寸如何。这是一个特定的语法格式,其中 full 是固定的,而 差值则是一个数值,这需要你来预估,比如:表格容器距离浏览器顶部和底部的距离“和” PS:该功能为 layui 2.1.0 版本中新增
      示例:height: ‘full-20’
      七.自动渲染
      所谓的自动渲染,即:在一段 table 容器中配置好相应的参数,由 table 模块内部自动对其完成渲染,而无需你写初始的渲染方法。其特点在上文也有阐述。你需要关注的是以下三点:
    1. 带有 class=“layui-table” 的 标签。
    2. 对标签设置属性 lay-data="" 用于配置一些基础参数
    3. 在 标签中设置属性lay-data=""用于配置表头信息
      按照上述的规范写好table原始容器后,只要你加载了layui 的 table 模块,就会自动对其建立动态的数据表格。
    展开全文
  • Layui使用方法总结

    千次阅读 2019-12-06 18:00:27
    Layui使用方法总结Layui前端框架的使用准备工作类名使用(后期会补充完整)公用form表单合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个...

    Layui前端框架概述

    layui 是一款采用自身模块规范编写的前端 UI 框架,遵循原生 HTML/CSS/JS 的书写与组织形式,门槛极低,拿来即用。使用方法十分简单,只需引用相关控件,即可直接编写和使用。
    

    准备工作

    1.直接百度打开layui官网首页即可下载最新的layui框架。
    在这里插入图片描述
    2.将下载好的layui组件直接放到项目中,在页面中引用即可。

    	  <link rel="stylesheet" href="layui/css/layui.css">
    	  <script src="layui/layui.js"></script>
    

    类名使用(后期在使用中会补充完整)

    类名作用
    layui-main用于设置一个宽度为 1140px 的水平居中块(无响应式)
    layui-inline用于将标签设为内联块状元素
    layui-box用于排除一些UI框架(如Bootstrap)强制将全部元素设为box-sizing
    layui-disabled用于设置元素不可点击状态(自带样式)
    layui-input使其独占一行
    layui-anim类似于调用,要想使用动画效果必须加此属性名
    layui-progress类似于调用,要想使用进度条效果必须加此属性名
    layui-btn类似于调用,要想使用按钮效果必须加此属性名

    时间选择器

    1.在页面中定义一个需要使用时间选择器的元素,并且添加一个id属性。

    <input type="text" class="layui-input" id="test1" placeholder="yyyy-MM-dd">
    

    2.js中在layui.use中来调用时间控件,在ladate.render中来填写选择器的相应属性和方法。

    layui.use('laydate', function(){
    var laydate = layui.laydate;
        laydate.render({
    
      });
    });
    

    3.选择器的属性

    属性名作用示例属性值
    elem绑定元素elem: ‘#test1’页面元素的class或者id
    type控制时间选择器的时间精确程度type: ‘year’year、month、date(默认值)、time、datetime
    range控制是否启用范围选择(会出现两个选择框);当直接自定义分隔符时,自动开启范围选择range: truetrue、false(默认)、‘分隔符’
    format格式化时间format:‘yyyy年MM月dd日’Y、y、M、m、D、d、H、h、s
    value设置初始值value: ‘2018-08-18’与format格式对应的时间、new Date(时间戳)
    isInitValue和value配合使用,控制是否向页面元素中填充初始值isInitValue: falsetrue、false(默认)
    min/max设置可选择的时间区间min: ‘1900-01-01’字符串、整数(正负均可)
    zIndex防止被其他元素遮盖zIndex:9999999整数
    showBottom控制是否显示选择器的底部栏showBottom:falsetrue、false
    btns选择器下方的按钮btns: [‘clear’, ‘confirm’]clear(默认值)、now(默认值)、confirm(默认值)
    lang控制时间选择器的语言lang: ‘en’cn(默认值)、en
    theme设置选择器的主题样式theme: ‘#34D24’default(默认简约主题)、molv(墨绿)、#颜色值(自定义)、grid(格子主题)
    calendar控制是否显示公历节日calendar: truetrue、false(默认)

    树形组件

    1.在页面中定义一个需要使用树形组件的元素,并且添加一个id属性。

    <div id="test1"></div>
    

    2.js中在layui.use中来调用时间控件,在ladate.render中来填写选择器的相应属性和方法。

    layui.use('tree', function(){
    var tree = layui.tree;
        tree.render({
    
      });
    });
    

    3.树形组件的属性

    属性名作用示例属性值
    elem绑定元素elem: ‘#test1’页面元素的class或者id
    date数据内容详见下方数据源表
    id设置唯一标识,用于传参id: ‘demoId’id名
    showCheckbox是否显示复选框showCheckbox: true,true、false(默认)
    edit是否开启节点操作edit: [‘add’, ‘update’, ‘del’]true(只显示改删图标)、false(默认)、 [‘add’, ‘update’, ‘del’]
    accordion是否开启手风琴模式accordion: truetrue、false(默认)
    onlyIconControl控制点击图标还是节点本身触发收缩 ,true只能点击图标,false点击图标和节点本身均可onlyIconControl:truetrue、false(默认)
    showLine是否开启连接线showLine:falsetrue(默认)、false

    4.数据源表

    属性名作用示例属性值
    title节点标题title: ‘标题’,标题内容
    id节点的唯一标识,用于操作单个节点id:id1,id名
    field节点的字段名称field: ‘name’字段名
    children子节点(属性同父节点一样)[{title: ‘子节点1’, id: ‘111’}]参考两个表
    spread节点是否初始化时展开spread:true,true、false(默认)
    checked节点是否被默认选中(前提开启复选框功能)checked:false,true、false(默认)
    disabled节点是否被禁用disabled:false,true、false(默认)

    5.获取选中节点的数据

    var checkData = tree.getChecked('demoId');
    

    6.动态勾选节点

    tree.setChecked('demoId', 1); //单个勾选 id 为 1 的节点
    tree.setChecked('demoId', [2, 3]); //批量勾选 id 为 2、3 的节点
    

    7.组件重载(覆盖之前的属性并重新加载)

    tree.reload('demoId', {
      //新的参数
    });
    

    进度条

    1.HTML代码(必须用这种div嵌套写法)

        <div class="layui-progress">
          <div class="layui-progress-bar" lay-percent="20%" ></div>
        </div>
    

    2.js代码

    //注意进度条依赖 element 模块,否则无法进行正常渲染和功能性操作
    layui.use('element', function(){
      var element = layui.element;
    });
    

    3.属性

    属性名作用示例属性值
    lay-showPercent是否显示进度条比例文本,如果不需要显示去掉属性即可lay-showPercent=“true”true、yes
    lay-percent控制进度条的比例lay-percent=“30%”true、yes

    4.样式

    在内层的div中设置进度条背景颜色

    <div class="layui-progress" lay-showPercent="yes">
      <div class="layui-progress-bar layui-bg-red" lay-percent="30%"></div>
    </div>
    

    在外层的div中设置进度条的大小

    <div class="layui-progress layui-progress-big">
      <div class="layui-progress-bar layui-bg-orange" lay-percent="50%"></div>
    </div>
    

    按钮

    1.使用方法

    向任意HTML元素设定class=“layui-btn”,建立一个基础按钮。通过追加格式为layui-btn-{type}的class来定义其它按钮风格。内置的按钮class可以进行任意组合,从而形成更多种按钮风格。

    2.按钮的class属性值

    类名效果
    layui-btn-primary原始按钮
    layui-btn-normal百搭按钮
    layui-btn-warm暖色按钮
    layui-btn-danger暖色按钮
    layui-btn-disabled禁止按钮
    layui-btn-lg大型按钮
    layui-btn-sm小型按钮
    layui-btn-xs迷你按钮
    layui-btn-fluid流体按钮(最大化适应)
    layui-btn-radius圆角按钮

    3.图标

    <i class="layui-icon">&#xe608;</i>
    //也可以使用这种方式
    <i class="layui-icon layui-icon-face-smile"></i>
    

    具体图标样式参考https://www.layui.com/doc/element/icon.html

    弹出框

    1.使用方法
    此处有两种使用的方法,如果作为独立组件使用,需要在layer独立版本的官网下载组件,并引入jquery和layer.js,在js中直接使用即可。

    layer.msg('title', {icon: 0, time: 1000 * 60 * 60 * 24, shade: 0.3});
    

    如果使用的layui,无需做其他操作,只引入 layui.css和layui.js,在layui.use中使用。

    layui.use('layer', function(){
      var layer = layui.layer;
      
      layer.msg('hello');
    });    
    

    2.基础参数
    type

    用来设置弹出框类型
    属性值:0(信息框,默认)1(页面层)2(iframe层)3(加载层)4(tips层)
    若采用layer.open方式调用,则type为必填项(信息框除外)

    layer.open({
      type: 1, 
      content: '传入任意的文本或html' //这里content是一个普通的String
    });
    

    title

    title支持三种类型的值:
    若传入的是普通的字符串,如title :‘我是标题’,那么只会改变标题文本;
    若需要自定义标题区域样式,title: [‘文本’, ‘font-size:18px;’],数组第二项可以写任意css样式;
    如果不需要显示标题栏,title: false

    skin

    支持自己创建样式或者使用内置样式 layui-layer-lan、layui-layer-molv

    area

    在默认状态下,layer是宽高都自适应的,也可以根据需求自定义 area: [‘width’, ‘height’]

    offset

    属性值
    offset: ‘auto’默认坐标,即垂直水平居中
    offset: ‘100px’只定义top坐标,水平保持居中
    offset: [‘100px’, ‘50px’]同时定义top、left坐标
    offset: ‘t’快捷设置顶部坐标
    offset: ‘r’快捷设置右边缘坐标
    offset: ‘b’快捷设置底部坐标
    offset: ‘lt’快捷设置左上角
    offset: ‘lb’快捷设置左下角
    offset: ‘rt’快捷设置右上角
    offset: ‘rb’快捷设置右下角
    layer.msg("skin的测试", { time: 9000, offset: ['100px', '50px']});
    //或者
    layer.open({
      type: 1, 
      offset:'t',
      content: '传入任意的文本或html' 
    });
    

    icon

    信息框默认不显示图标。当你想显示图标时,默认皮肤可以传入0-6,如果是加载层,可以传入0-2。

    layer.msg('content, {icon: 5});
    

    btn

    btn默认是一个确认按钮,其它层类型则默认不显示,加载层和tips层则无效。当然,可以定义更多按钮,比如:btn: [‘按钮1’, ‘按钮2’, ‘按钮3’, …],按钮1的回调是yes,而从按钮2开始,则回调为btn2: function(){},以此类推。

            layer.confirm(confirm, {
                icon: 3, btn: ['是', '否'], yes: function (index) {
                        seccessMsg = "请示成功!";
                        url = "${ctx}/projectFirstReview/noticeDirectorApprove";
                        approvalBtn(url, reviewTaskId, auditLevel, reviewTaskSubId, o, msg,  seccessMsg);
                }, btn2: function (index) {
                    layer.close(index);
                }
            });
    
    layer.open({
      content: 'test'
      ,btn: ['按钮一', '按钮二', '按钮三']
      ,yes: function(index, layero){
        //按钮【按钮一】的回调
      }
      ,btn2: function(index, layero){
        //按钮【按钮二】的回调
        
        //return false 开启该代码可禁止点击该按钮关闭
      }
      ,btn3: function(index, layero){
        //按钮【按钮三】的回调
        
        //return false 开启该代码可禁止点击该按钮关闭
      }
    });
    

    id

    设置该值后,不管是什么类型的层,都只允许同时弹出一个。一般用于页面层和iframe层模式

    anim

    目前anim可支持的动画类型有0-6。 如果不想显示动画,设置 anim: -1 即可

    属性值效果
    0平滑放大(默认)
    1从上掉落
    2从底部往上滑
    3从左滑入
    4从左翻滚
    5渐显
    6抖动

    还有其他属性后续更新…

    数据表格

    1.使用方法

    HTML代码

    <table id="demo" lay-filter="test"></table>
    

    Js代码

    var table = layui.table;
     
    //执行渲染
    table.render({
      elem: '#demo' //指定原始表格元素选择器(推荐id选择器)
      ,height: 315 //容器高度
      ,cols: [{}] //设置表头
    });
    

    表头参数

    参数作用参数值
    field设置字段名
    title设置标题
    minWidth设置最小宽度
    type设置列类型checkbox(复选框)、radio(单选框)、numbers(序号)、space(空列)
    LAY_CHECKED控制是否为全选状态,必须设置复选框才能生效true、false(默认)
    fixed控制对应列固定住,不会随滚动条移动。必须放在最左或者最右left、right
    totalRow是否开启该列的合计功能true、false(默认)
    totalRowText设置合计的文本内容“合计:”
    sort是否开启排序功能,按照ASCII表排序true、false(默认)

    CSS动画

    1.使用方法

    使用方法非常简单,只需要在页面中定义div元素即可

    <div class="layui-anim"></div>
    

    2.属性值

    属性名作用
    layui-anim类似于调用,要想使用动画效果必须加此属性名
    layui-anim-up从最底部往上滑入
    layui-anim-upbit微微往上滑入
    layui-anim-scale平滑放大
    layui-anim-scaleSpring弹簧式放大
    layui-anim-fadein渐现
    layui-anim-fadeout渐隐
    layui-anim-rotate360度旋转
    layui-anim-loop添加此属性可循环动画直至再次点击

    滑块

    1.使用方法

    html代码

    <div id="slideTest"></div>
    

    js代码

    layui.use('slider', function(){
      var slider = layui.slider;
      //渲染
      slider.render({
        elem: '#slideTest'  //根据id绑定指定元素
      });
    });
    

    2.属性

    属性名作用示例属性值
    elem绑定指定元素elem: ‘#slideTest’
    type设置滑块为竖向还是横向type: ‘vertical’default(默认,横向)、vertical(竖向)
    height设置滑块高度,需将滑块设置为竖向才可生效height:150默认为200
    min设置滑块最小值min:10默认为0
    max设置滑块最大值max:1000默认为100
    range设置滑块是否开启范围选择range: truefalse(默认)、true
    value设置滑块初始值,若开启范围选择则需要设置值为数组value: 20、value:[10,50]
    step设置滑块拖动一次的值( 步长)step:10默认为1
    showstep设置滑块在每个值的位置放置一个间断点showstep:truefalse(默认)、true
    tips设置滑块是否显示文字提示(也可以设置自定义文字提示,详见下方代码)showstep:falsefalse、true(默认)
    showstep设置滑块在每个值的位置放置一个间断点showstep:truefalse(默认)、true
    input设置滑块是否显示输入框,若显示,则可在输入框设置数字并回车即可操作滑块,同时滑块滑动input的值也随之变化showstep:truefalse(默认)、true
    disabled设置滑块是否可以滑动disabled:truefalse(默认),true

    自定义提示文本写法

      slider.render({
        elem: '#slideTest12',
        setTips: function(value){ //自定义提示文本
         return value + '%';
        }
      });
    
    展开全文
  • layui第一步第二步第三部layui.use()中调用外部调用 第一步 页面中引入layui.all.js <script src="/static/layui/layui.all.js" charset=...// 暴露方法 layui.define(['layer', 'table'], function (exports) ...
  • 今天小编就为大家分享一篇layui use 定义js外部引用函数的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
  • 今天小编就为大家分享一篇使用layui 的layedit定义自己的toolbar方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
  • 方法对loading层和tips层无效。参数index为层的索引,cssStyle允许你传入任意的css属性。 //重新给指定层设定width、top等 layer.style(index, { width: '1000px', top: '10px' }); ...
  • layui定义方法 获取选中的信息数组 在这里插入代码片 //js var checkStatus =[] , data = [] table.on('checkbox(newList)', function(obj){ checkStatus = table.checkStatus('newListTable');...
  • layui.use里面定义方法外面怎么调用 解决办法:方法内部加window //加了window后 可以被外部引用 window.uploadData= function(){ } 源码: layui.use(['layer', 'laypage', 'jquery', 'table''...
  • 今天学习别人的方法渲染表格动态添加、修改、删除行。 //表格渲染 var tableId = "dataTable"; var tableIns = table.render({ elem: "#" + tableId, id: tableId, data: tbData, page: false, cols: [[ {...
  • layui - 底层方法

    2020-12-04 11:17:38
    定义模块 layui.define([mods], callback) 加载所需模块 layui.use([mods], callback) 动态加载CSS layui.link(href) 本地存储 => 对localStorage和sessionStorage的友好封装以更方便地管理本地数据 获取设备...
  • layui.use 加载layui.define 定义的模块,当外部 js 或 onclick调用 use 内部函数时,需要在 use 中定义 window 函数供外部引用 window.test= function(){ alert("test"); }
  • 1. layui官方网址: https://www.layui.com/。 2. 点击立即下载按钮, 下载最新版的layui。 3. 下载完成layui-v2.5.7.zip。 4. 解压缩layui-v2.5.7.zip, 查看layui目录。 5. layui目录说明。 6. 引入...
  • LayUI

    2021-08-25 15:34:54
    由国人开发,16年出厂的框架,其主要提供了很多好看、方便的样式,并且基本拿来即用,和Bootstrap有些相似,但该框架有个极大的好处就是定义了很多前后端交互的样式接口,如分页表格,只需在前端配置好接口,后端则...
  • layer内置了轻量级加载器,不需要单独引入css等文件...当在页面一打开就要执行弹层时,最好是将弹层放入ready方法中,如: //页面一打开就执行弹层 layer.ready(function(){ layer.msg('很高兴一开场就见到你');...
  • Layui

    2021-04-21 09:25:12
    Layui前端框架简述 前方高能预警 !!!! 新手小白重现江湖 噔!噔!蹬!蹬! 小涛同志温馨提示:不是大神也不是大佬,只是一个学习后端,稍微了解前端的微不足道的程序员小白,时不时更新一些前端、后端知识,...
  • layUI

    2018-10-07 16:09:00
    关于layUI模块的核心,就是 layui.js 的两个底层方法:一个用于定义模块的 layui.define(),一个加载模块的 layui.use() 1、预先加载 Layui的模块加载采用核心的 layui.use(mods, callback)方法,当你的JS 需要...
  • layui

    2021-05-31 11:53:16
    1.通过对一个内联元素(一般推荐用 i标签)设定 class=“layui-icon”,来定义一个图标; 2.然后对元素加上图标对应的 font-class(注意:layui 2.3.0 之前只支持采用 unicode 字符),即可显示出你想要的图标; 譬如...
  • 使用layui自己定义的function无法使用

    千次阅读 2019-03-20 13:31:56
    表单里: <DIV class=layui-form-item> <DIV class=layui-input-block> <BUTTON class=layui-btn type=submit lay-filter="demo1" lau-submit onclick="return check...

空空如也

空空如也

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

layui定义方法