layui定义一个模块并使用的实例

在使用layui的过程，有几个方法需要被多个js引用，所以我按照文档，自定义了一个layui的模块，下面实现过程（推荐：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定义一个模块并使用的实例的详细内容，更多内容请关注技术你好其它相关文章！