使用Layui时间组件（laydate）

在一般的程序或者软件业务的操作上，通常涉及时间的记录，需要记录业务时间，或者根据时间来筛 选业务。
选择时间，可以直接输入，也可以弹出日期进行选择。
在layui中提供了，layDate日期时间模块，
主要提供了五种选择器：年选择器，年月选择器，日期选择器，时间选择器，日期时间选择器。

   <div class="layui-inline">
        <label class="layui-form-label">中文版：</label>
        <div class="layui-input-inline">
            <input type="text" class="layui-input" id="Chinese" placeholder="yyyy-MM-dd">
            <i class="layui-icon Date_icon">&#xe637;</i>
        </div>
    </div>
    <div class="layui-inline">
        <label class="layui-form-label">国际版：</label>
        <div class="layui-input-inline">
            <input type="text" class="layui-input" id="English" placeholder="yyyy-MM-dd">
            <i class="layui-icon Date_icon">&#xe637;</i>
        </div>
    </div>
    <div class="layui-inline mt-3">
        <label class="layui-form-label" style="width:120px;">日期时间选择器：</label>
        <div class="layui-input-inline">
            <input type="text" class="layui-input" id="shijianriqi" placeholder="yyyy-MM-dd HH:mm:ss">
            <i class="layui-icon Date_icon">&#xe637;</i>
        </div>
    </div>
    <h6 class="mb-3 mt-3">嵌套显示</h6>
    <div class="site-demo-laydate">
        <div class="layui-inline mr-3" id="nestnne"></div>
        <div class="layui-inline ml-3" id="nestwo"></div>            
    </div>

  <script>
    //声明变量
    var layer, layDate;
    $(function () {
        //预加载模块
        layui.use(['layer', 'laydate'], function () {
            //加载模块
            layer = layui.layer;
            layDate = layui.laydate;
            //中文
            layDate.render({
                elem: '#Chinese',//绑定元素
                theme:'#393D49'//主题
            });
            //英文
            layDate.render({
                elem: '#English',
                lang: 'en',
                theme: '#ff0000'
            });
            //日期时间选择器
            layDate.render({
                elem: '#shijianriqi',
                type:'datetime',
                theme: '#000000'
            });
            //嵌套显示
            layDate.render({
                elem: '#nestnne',
                theme: '#ff0000',
                position: 'static'
            });
            layDate.render({
                elem: '#nestwo',
                lang: 'en',
                theme: '#ea7c12',
                position: 'static'//页面嵌套显示
            });
        });
    });
</script>

layui的laydate模块提供多属性支持，可嵌套在页面上，可设置主题的颜色等等。
layui的laydate模块，提供了type–控件选择类型：

type可选值	名称	用途
year	年选择器	只提供年列表选择
date	年月选择器	只提供年、月选择
year	日期选择器	可选择：年、月、日。type默认值，一般可不填
time	时间选择器	只提供时、分、秒选择
datetime	日期时间选择器	可选择：年、月、日、时、分、秒

laydate提供format属性–自定义时间格式 默认格式：yyyy-MM-dd

Layui的laydate时间日期控件中的中文版和英文版，其实区别不是很大，区别是弹出或嵌套显示的
时间日期选择页面中的中文全部英文形式代替，如果格式一样，那么进行选择后显示的是一样的。
主要以阿拉伯数字显示。

laydate详情请查看Layui官网：https://www.layui.com/