JS日历插件laydate.js

简介

ayDate是一款JS日历插件，除了包含日期范围限制、开始日期设定、时分秒选择、智能响应、自动纠错、节日识别，快捷键操作等常规功能外，还拥有更多趋近完美的解决方案。

它具有以下特定：

1）科学的接口设计

她并不提倡API的数量性，而是尽可能呈现最人性合理的接口，减少使用成本。

2）一流的代码驱动

layDate完全用原生JavaScript实现，代码采用自由灵活风格，内部封装了众多轻量级的方法引擎，保证了良好的速度体验和接近于零的代码冗余。

3）人性的皮肤体系

她非常注重外观设计，因此她提供了非常强大的皮肤选择支持，不仅官方会提供海量的皮肤下载，您还可以很方便地按照喜好去自定义皮肤，我们非常欢迎您能够贡献皮肤包，具体操作事宜请查看皮肤库页面。

参数说明：

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){  // 选择好日期的回调}

（下载的附件中包含有多种皮肤和DEMO）

使用

1.  引入 laydate.js 文件

2.  简单使用

// 开始时间
var start = laydate.render({
  elem: '#startTime',
  theme: 'molv',
  trigger: 'click',
  //采用click弹出
  done: function(value, date, endDate) {
    end.config.min = {
      year: date.year,
      month: date.month - 1,
      date: date.date,
      hours: date.hours,
      minutes: date.minutes,
      seconds: date.seconds
    };
    //开始日选好后，重置结束日的最小日期
    end.config.value = {
      year: date.year,
      month: date.month - 1,
      date: date.date,
      hours: date.hours,
      minutes: date.minutes,
      seconds: date.seconds
    };
    //将结束日的初始值设定为开始日
  }
});

// 结束时间
var end = laydate.render({
  elem: '#endTime',
  theme: 'molv',
  trigger: 'click',
  //采用click弹出
  done: function(value, date, endDate) {
    start.config.max = {
      year: date.year,
      month: date.month - 1,
      date: date.date,
      hours: date.hours,
      minutes: date.minutes,
      seconds: date.seconds
    }; 
    //结束日选好后，重置开始日的最大日期
  }
});

相关链接

GitHub 地址 ：https://github.com/lousaibiao/laydate