jquery.cxcalendar 插件基本使用

初始版本:

git詳細介紹https://github.com/ciaoca/cxCalendar

<link href="~/Content/Calendar/css/jquery.cxcalendar.css" rel="stylesheet" />
<label>
    選擇年份
</label>
<select id="timeselect">
    <option value="2019">2019</option>
    <option value="2018">2018</option>
    <option value="2017">2017</option>
    <option value="2016">2016</option>
</select>
<label>選擇日期</label>
<input type="text" data-start-date="2000" data-end-date="2019" data-format="YYYY/M/D" id="time1"  />-<input type="text" id="time2" />
<script src="~/Content/assets/global/plugins/jquery.min.js"></script>
<script src="~/Content/Calendar/js/jquery.cxcalendar.min.js"></script>
<script src="~/Content/Calendar/js/jquery.cxcalendar.languages.js"></script>
<script type="text/javascript">
    $(function () {
        $("#timeselect").val(new Date().getFullYear());
        var time1 = $("#time1");
        var time2 = $("#time2");
        time1.cxCalendar(function (api) {
            time1Api = api;
            time1Api.setOptions({
                type: 'date',//設置爲datetime 會精確到秒
                format: 'YYYY-MM-DD',
                baseClass: 'cxcalendar_notsecs',
            });
        });
        time2.cxCalendar(function (api) {
            time2Api = api;
            time2Api.setOptions({
                type: 'date',
                format: 'YYYY-MM-DD',
                baseClass: 'cxcalendar_notsecs'
            });
        });
        time1.bind('change', function () {//時間輸入框聯動
            var vartime1 = parseInt(time1Api.getDate('TIME'), 10);
            var timedate = time1Api.getDate('YYYY-MM-DD');
            var vartime2 = parseInt(time2Api.getDate('TIME'), 10);
            if (vartime2 < vartime1) {
                time2Api.clearDate();
            };
            time2Api.setOptions({
                startDate:timedate 

}); time2Api.show(); }) //$("#time1").cxCalendar(); }); </script>