laydate 插件 基本使用及开始及结束时间限制

页面工作中，时间日期插件必不可少，最近用了 layDate 日期组件，简洁易用，样式清爽，记录下。

核心方法：laydate(options);
                options是一个对象，它包含了以下key: '默认值'
                      elem: '#id',                        // 日期显示元素选择器，laydate.js封装了一个轻量级的选择器引擎，因此elem还允许你传入class、tag但必须按照这种方式 '#id .class'
                      event: 'click',                    // 触发事件。如果没有传入event，则按照默认的click
                      format: 'YYYY-MM-DD hh:mm:ss',    // 日期格式
                      istime: false,                        // 是否开启时间选择
                      isclear: true,                        // 是否显示清空
                      istoday: true,                    // 是否显示今天
                      issure: true,                        // 是否显示确认
                      festival: true,                    // 是否显示节日
                      min: '1900-01-01 00:00:00',            // 最小日期
                      max: '2099-12-31 23:59:59',        // 最大日期
                      start: '2014-6-15 23:00:00',            // 开始日期
                      fixed: false,                        // 是否固定在可视区域
                      zIndex: 99999999,                // css z-index
                      choose: function(dates){            // 选择好日期的回调
                  }
二、其它方法/属性
                  laydate.v            // 获取laydate版本号
                  laydate.skin(lib);    // 加载皮肤，参数lib为皮肤名             
                  /*
                     layer.now支持多类型参数。timestamp可以是前后若干天，也可以是一个时间戳。format为日期格式，为空时则采用默认的“-”分割。
                      如laydate.now(-2)将返回前天，laydate.now(3999634079890)将返回2096-09-28
                 */
                  layer.now(timestamp, format);   // 该方法提供了丰富的功能，推荐灵活使用。          
                  laydate.reset();                // 重设日历控件坐标，一般用于页面dom结构改变时。无参

初始化方法：

可以直接在input中使用 

<input onclick="laydate({istime: true, format: 'YYYY-MM-DD hh:mm:ss'})">

也可以直接在外部js中调用

<input id="hello" class="laydate-icon">
<script>
laydate({
  elem: '#hello', //目标元素。由于laydate.js封装了一个轻量级的选择器引擎，因此elem还允许你传入class、tag但必须按照这种方式 '#id .class'
  event: 'focus' //响应事件。如果没有传入event，则按照默认的click
});

如果需要input框默认显示当前时间 可以设置value=laydate.now();

通常我们在做时间搜索的时候会要求做起始时间限制，网上比较常见的一个方法是

$(function(){  
    var start = {  
        elem: '#start', //选择ID为START的input  
        format: 'YYYY/MM/DD hh:mm:ss', //自动生成的时间格式  
        min: laydate.now(), //设定最小日期为当前日期  
        max: '2099-06-16 23:59:59', //最大日期  
        istime: true, //必须填入时间  
        istoday: false,  //是否是当天  
        start: laydate.now(0,"YYYY/MM/DD hh:mm:ss"),  //设置开始时间为当前时间  
        choose: function(datas){  
             end.min = datas; //开始日选好后，重置结束日的最小日期  
             end.start = datas //将结束日的初始值设定为开始日  
        }  
    };  
    var end = {  
        elem: '#end',  
        format: 'YYYY/MM/DD hh:mm:ss',  
        min: laydate.now(),  
        max: '2099-06-16 23:59:59',  
        istime: true,  
        istoday: false,  
        start: laydate.now(0,"YYYY/MM/DD hh:mm:ss"),  
        choose: function(datas){  
            start.max = datas; //结束日选好后，重置开始日的最大日期  
        }  
    };  
    laydate(start);  
    laydate(end);  
    })  

但是这个方法会有一个问题，就是点击 组件自带的“清除”时，并没有触发choose事件，另一个时间的限制没有解除

所以放弃组件本身choosen方法使用原生点击时间限制，这样就解决了上一个问题

    $("#startDate").click(function(){
        var end=$("#endDate").val();
        var obj={
            elem: '#startDate'
        };
        end&&(obj.max=end);
        laydate(obj);
    });
    $("#endDate").click(function(){
        var start=$("#startDate").val();
        var obj={
            elem: '#endDate'
        };
        start&&(obj.min=start);
        laydate(obj);
    });