日期选择器使用文档

1. 周末、节假日有图标或者背景区分
2. 支持日历联动 。如酒店checkin日期选择后，再选check out日期的话，check in之前的时间不能选。
3. 指定日期可用，只能选择设置好的日期。
4. 禁用指定日期，如7天内的日期不能选择,或者指定的某天不能选择。
5. 支持日历备注，方便展示各种信息，如价格、促销信息、时差提醒
6. 样式要能够根据站点不用调用不同的CSS
7. 易用性、多浏览器兼容性、自适应
8. 支持多语种

温馨提示

  1. 节假日目前只是把字体标注为红色，可以根据需要自己调整为需要的背景
  2. 目前支持ie6+（不包括ie6）
  3. 兼容目前我们网前正在用的bootstrap框架

使用方法

引入资源文件:

');?>

') ?>

初始化日历：

$("input").lyydatepicker();'); ?>

使用范例:

普通日历

$('#demo3').lyydatepicker();

设定开始日期、允许选择年份、月份视图

$('#demo4').lyydatepicker({startDate: '2015-07-20',defaultDate: '2015-07-20'});

支持日历备注，方便展示各种信息，如价格、促销信息、提醒,点一下7.30号看看

$('#demo5').lyydatepicker({ 

    remarks:'[

           //说明：date是日期，remark是日期备注，title是日期的标题，点击日期后title会在整个日历的底部展示出来

           //如果date为default，则对应的remark值会成为每一个日期的默认备注

           {"date":"default","remark":"$625"},

           {"date":"2015-7-18","remark":"$512"},

           {"date":"2015-7-30","remark":"$1024","title":"吼吼"} 

    ]',

     date_description:"这个整个日历底部的备注说明",

     autoclose: false，

     onSelect:function(f){ 

            $('#demos').data("startDate",f); 

     }

});

联动日历：checkin日期选择后，再选check out日期的话，check in之前的时间不能选

$('#demo').lyydatepicker({

     format: 'yyyy/mm/dd', 

     onSelect:function(f,n){ 

         $('#demos').data("startDate",f); 

         $('#demos').data("defaultDate",n); 

     } 

 });

区分节假日(包括传统节日、周末)

$('#demo7').lyydatepicker({

     festival_replace_date:false, //节日名称是否覆盖日期

     festival:true //显示节假日

 });

添加超链接

$('#demo8').lyydatepicker({ 

     remarks:'[

            {"date":"2015-6-26","link":"http://www.mycht.cn","remark":"点我"}

    ]' 

 });

指定日期可用

$('#demo6').lyydatepicker({

     startDate: '2015-07-20', 

     remarks:'[

            {"date":"2015-6-18"},

            {"date":"2015-6-30"}]', 

     onlyremarkdate:true 

 });

其他

$('#demo9').lyydatepicker({

     format:"mm/dd/yyyy h:i:s", 

     language:"zh",//语言选择

     todayBtn:true, //显示今天按钮

     autoclose: false, //选择日期之后不自动关闭日历

     numberOfMonths:2, //一次显两个日历

     max_width:"800", //日历宽度800px

     festival:true, //区分节假日

     onSelect:function(f){//选择日期之后调用的操作 

         alert("吼吼，你选择了:"+f)

     } 

 });
可供配置的选项说明:

var options = { 

     event: "click",//激活日历的事件 

     format: 'yyyy/mm/dd',//日期格式,没有前导零请使用yy、m、d 

     startDate: '1900-01-01',//可用日期起始日 

     endDate: '2100-12-31',//可用日期结束时间 

     defaultDate: '',//默认选中日期

     language: 'en',//语种 

     date_description:'',//日历底部默认备注 

     changeMonth: true,//月份可以改变 

     changeYear: true,//年份可以选择 

     todayBtn: false,//显示“今天”按钮 

     autoclose: true,//是否显示“确定”按钮，选择日期后自动关闭日历 

     festival: false,//区分节假日 

     festival_replace_date:true,//用节假日名称代替日期 

     remarks: false,//日期备注

     onlyremarkdate:false,//指定日期可用 

     disable_date:'2015-07-25,2015-07-27,2015-07-29',//禁用指定日期 

     numberOfMonths:1,//日历显示一个月或者多个月 

     max_width:360,//日历最大宽度 

     row_height:45,//具体每一格日期的高度 

     onSelect: function(selectedday,nextday)//选择日期之后的调用的函数 

 };