js多选日期控件

浏览数：24 / 时间：2015年06月09日

js多选日期控件

详情请见：http://www.lovewebgames.com/jsmodule/calendar.html

它的github地址：https://github.com/tianxiangbing/calendar

 

calendar

js日历控件

用法

 1  <input type="text" id="calendar" value="2015-04-15"/>
 2     <script src="../src/jquery-1.9.1.min.js"></script>
 3     <script src="../src/calendar.js"></script>
 4     <script>
 5         var calendar = new Calendar();
 6         calendar.init({
 7             target: $(‘#calendar‘),
 8             range: [‘2015-3-5‘, ‘2015-3-25‘],
 9             multiple: true,
10             maxdays: 5,
11             overdays: function(a) {
12                 alert(‘添加已达上限 ‘ + a + ‘ 天‘);
13             }
14         });
15     </script>

 

或者

    <input type="text" class="calendar" value="2015-03-14"/>
    <input type="text" class="calendar2" value="2015-03-18"/>

    <script src="../dist/jquery-1.9.1.min.js"></script>
    <script src="../dist/calendar-jquery.min.js"></script>
    <script>
        $(".calendar").Calendar({toolbar:true});
        $(".calendar2").Calendar();
    </script>

　　

属性和方法

属性

date:

    当前日期.

toolbar:bool

    是否显示下方操作栏

separator:

    日期分隔符，默认"-".

id:

    日历容器ID

calendarContainer:

    日历容器对象

dayArr:

    [‘日‘, ‘一‘, ‘二‘, ‘三‘, ‘四‘, ‘五‘, ‘六‘]

monthArr:

    ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"]

isShow:是否显示中

maxdays:多选时最大天数

方法

setRange:function(range)

设置日期可选范围的方法

init:function(settings)

settings参数

focusDate:

    当前选中日期{{2015-01-02}}

target:

    触发日历的事件结点，可以是input或其他标签，如果是input会默认取value作为focusDate,
    否则取target的前一个input的value值，或取当前时间.

selected:function(a,b)

    选中后的回调事件，参数为(a)时间对象 ,(b)日历容器

beforeSelect:function(a,b)

    选择前触发方法，参数为(a)时间对象 ,(b)日历容器

overdays:function(daysnum)

    超出限定天数时的回调（多选时）

 

郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。

标签： class style log com src http html it la class style log com src http html it la

相关文章

随机文章

您可能还喜欢

您可能还喜欢