• 技术文章 >web前端 >Layui教程

    layui怎么使用模块化

    VV2020-11-30 14:01:00原创825

    layui使用模块化的方法:遵循layui的模块规范建立一个入口文件,并通过layui.use()方法加载该入口文件即可,如【layui.use(['layer'],function(){var layer = layui.layer}】。

    本教程操作环境:windows10系统、layui2.5.6版,该方法适用于所有品牌电脑。

    (学习视频分享:javascript视频教程

    模块化的使用:

    注意:引入的JS是:/layui/layui.js

    遵循 layui 的模块规范建立一个入口文件,并通过 layui.use() 方式来加载该入口文件

    示例:

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="UTF-8">
        <title>模块化的使用</title>
        <link rel="stylesheet" href="./layui/css/layui.css">
    
        <!--引入这个JS-->
        <script type="text/javascript" src="./layui/layui.js"></script>
    
    </head>
    <body>
    
    
    <script>
        /*必须使用这个方法先引用对应的模块*/
        layui.use(['layer'],function () {
            var layer = layui.layer;
            layer.alert("xxxxxxxxxxxxxxxxxxxxxxxx")
        })
    </script>
    
    
    </body>
    </html>

    补充:为了方便使用可以使用下面方法引入

    function deleteDictBatch(){
        var form,layer;
        layui.use(['form','layer'],function () {
            form = layui.form;
            layer=layui.layer;
        });
        //获取选中的元素的个数
        var length_1 = $("[name='dictionaryCheckbox']:checked").length;
        //1.如果选中的个数为0,直接退出函数,提示选择字典删除
        if(length_1 ==0 ){
            layer.alert("请选中需要删除的字典")
            return ;
        }
        //如果有元素需要被删除
        else{
            if(!confirm("您确认要删除下列字典?")){//点取消也退出函数
                return;
            }
            //第二种方式,以数组的方式去提交。后台用string接收
            var values = [];
            $("[name='dictionaryCheckbox']:checked").each(function (i) {//i代表索引
                values[i]=$(this).val();
            })
            $.post(contextPath+'/dictionary/deleteDictBatch.do',{dictionaryIds:values.toString()},function(response){
                alert(response);
                if(response == "删除成功"){
                    getDictionaryTree();//查询字典树
                    getDictionaryFY();//分页查询字典信息
                }
            },'text')
            //删除的业务逻辑
        }
    }

    也可以将layer和form作为全局变量引入使用:

    /**
     * @author: qlq
     * @time: 9:31
     * @description:    添加培养方案的JS
     */
    
    /**
     * 一次性自调函数初始化两个全局变量
     */
    var lyer,form;
    (function () {
        layui.use(['layer','form'],function () {
            layer=layui.layer,form=layui.form;
        })
    })();
    
    /**
     * 页面加载完成后执行一些函数
     */
    $(function () {
        layer.msg("消息框")
    });
    
    
    /**********S   *****************/

    相关推荐:layui

    以上就是layui怎么使用模块化的详细内容,更多请关注php中文网其它相关文章!

    声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理
    专题推荐:layui 模块化
    上一篇:layui怎么用open属性隐藏按钮 下一篇:layui调用弹层的方法
    线上培训班

    相关文章推荐

    • golang 如何模块化• go mod模块化介绍• C语言程序的模块化通过什么实现• 详解ES6模块化和CommonJS模块化的区别

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网