【fullCalendar日历控件】根据日历控件展示的月份，控制datetimebox初始化显示控件的月份信息。

背景

公司在使用fullcalendar插件制作会议室预约模块时，有这么一个需求：日历显示某月，在新建信息初始化datatimebox时，默认时间要显示某月时间。折腾了好久，不知从何下手，最后还是师傅出马解决的。下班后研究了一下，特此记录。

---

实现

• 获取显示月份的值，显示形式如：六月，通过参数monthyear传递到新建信息页面。

$("#addScheduleBtn").click(
        function addSchedule() {
            //获取当前月份
            var view = $('#calendar').fullCalendar('getView');
            var title = view.title;
            var url = "${pageContext.request.contextPath}/administration/boardroom/boardroom/toEditJsp.do?editType=1&monthYear="+title;
            var obj = {
                url: url,
                title: '添加会议信息',
                id: 'boardroomAdd'
            };
            getDialogPage(obj);
        });

• 在新建信息页面处理获取的monthyear。将该参数处理成日期字符串的形式。

function initDateBox() {
        //将monthYear转换成日期字符串，并初始化起始日期和结束日期
        var a = $("#monthYear").val()
        var b = a.slice(" ");
        var time = "";
        var month = 0;
        var date = new Date();
        if (b[1] == "月") {
            //9月以前
            switch (b[0]) {
                case "一":
                    month = 1;
                    break;
                case "二":
                    month = 2;
                    break;
                case "三":
                    month = 3;
                    break;
                case "四":
                    month = 4;
                    break;
                case "五":
                    month = 5;
                    break;
                case "六":
                    month = 6;
                    break;
                case "七":
                    month = 7;
                    break;
                case "八":
                    month = 8;
                    break;
                case "九":
                    month = 9;
                    break;
                case "十":
                    month = 10;
                    break;
            }
            time = b[3] + b[4] + b[5] + b[6] + "-" + month + "-01";
        } else {
            //10月以及以后
            switch (b[1]) {
                case "一":
                    month = 11;
                    break;
                case "二":
                    month = 12;
                    break;
            }
            time = b[3] + b[4] + b[5] + b[6] + "-" + month + "-01";
        }
        //获取当前的时分秒
        var hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
        var minute = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
        var second = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
        time = time + " "+hour + ":" + minute + ":" + second;
        //如果是当前月份，则直接默认用当前时间
        if(date.getMonth()+1 != month) {
            date = new Date(time);
        }
        $("#beginDate").datetimebox('setValue',getTime(date));
        //初始化约定完成日期
        $("#endDate").datetimebox('setValue',getTime(date));
    }

至此，当选择其他月份的时候，初始化日期功能显示完成。感谢大佬~

总结

1、页面展示出来的数据，可以通过js方法获取到。如何获取页面元素，可参考本文：js获取页面元素方法
2、可以将所需处理的数据通过参数传递到需要调用的页面。
3、多运用字符串处理的方法。