layui模块化与非模块化的不同引用方式介绍

layui模块化与非模块化的不同引用方式：

1、模块化与非模块化的区别

layui中有许多不同的内置模块，如弹出层、日期与时间选择器、分页等不同模块。

模块化：使用时加载相应的模块。

非模块化：一次性加载所有的模块。

2、模块化的引用

引用   ../layui/layui.js

① 通常编写一个工具类 layui.util.js（可扩展），在jsp页面中直接引用

var layer;var laydate;layui.use(['layer','laydate'], function() {    layer = layui.layer;    laydate = layui.laydate;});

登录后复制

② jsp页面

nbsp;html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  $(function(){　　laydate.render({    　　　　elem: '#test' //指定元素 　　});  });  function openLayui() {　　layer.msg('hello');　　　　layer.open({　　　　type : 1,　　　　maxmin : true,　　　　area: ['500px', '300px'],　　　　content : $('#inputId'),　　　　btn: ['确定', '重置', '关闭'], //可以无限个按钮,　　　　btn1: function(index, layero){　　　　　　alert(parent.$("#inputId").val());　　　　　　//layer.close(parent.layer.getFrameIndex(window.name));　　　　　　layer.close(index);　　　　},　　　　btn2: function(index, layero){　　　　　　layer.style(index, {  　　　　　　　　width: '80px'　　　　　　});　　　　　　parent.$("#inputId").val("button");　　　　　　return false;　　　　},　　　　btn3: function(index, layero){　　　　　　alert(index);　　　　　　return false; 　　　　}　　　});　　var index = layer.getFrameIndex(window.name);　　layer.title('傻逼', index);}　　　　

登录后复制

3、非模块化的引用

引用   ../layui/layui.all.js

通常编写一个工具类 layui.util.js（可扩展）,在jsp页面直接引用 layer,laydate….

var layer = layui.layer;var laydate = layui.laydate;

登录后复制

或者直接在jsp页面使用layui.layer、layui.laydate 均可

更多layui知识请关注PHP中文网layui使用教程栏目。

以上就是layui模块化与非模块化的不同引用方式介绍的详细内容，更多请关注【创想鸟】其它相关文章！