layui怎么使用模块化

互联网 20-11-24

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怎么使用模块化

相关资讯

标签推荐