Javascript 完整日历-读取键盘箭头键并派生与单击日期单元格相同的行为

Javascript 完整日历-读取键盘箭头键并派生与单击日期单元格相同的行为,javascript,jquery,fullcalendar,keypress,Javascript,Jquery,Fullcalendar,Keypress,我试图读取键盘上的箭头键,并得出与单击日期单元格相同的行为 非工作代码被注释掉,gotodate工作,但简单地实现或减少一到七个日期不会导致日期突出显示 我想把目标日期单元格放在焦点上,突出显示它,并从我留下的单元格中删除突出显示。我相信我不理解或无法解释dayClick函数 $(document).ready(function() { var calendar = $('#calendar').fullCalendar({ header: {

我试图读取键盘上的箭头键,并得出与单击日期单元格相同的行为

非工作代码被注释掉,gotodate工作,但简单地实现或减少一到七个日期不会导致日期突出显示

我想把目标日期单元格放在焦点上,突出显示它,并从我留下的单元格中删除突出显示。我相信我不理解或无法解释dayClick函数

$(document).ready(function() {
    var calendar = $('#calendar').fullCalendar({
        header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,agendaWeek,agendaDay'
            },
                editable: true,
       defaultDate: '2015-02-12',
            selectable: true,
            selectHelper: true,
            select: function(start, end){
            //var title = prompt('Event Title:');
                var eventData;
            if (title) {
                eventData = {
                    title: title,
                    start: start,
                    end: end
                };
                    $('#calendar').fullCalendar  ('renderEvent', eventData, true); // stick? = true
                }
                $('#calendar').fullCalendar('unselect');
            },

            eventLimit: true, // allow "more" link when too many events
            events: {
                url: 'php/get-events.php',
            },
            loading: function(bool) {
                $('#loading').toggle(bool);
                }

 });
$('#my-prev-button').click(function() {
    $('#calendar').fullCalendar('prev');
});
   $('#my-next-button').click(function() {
    $('#calendar').fullCalendar('next');
});
// Hover states on the static widgets
$( "#dialog-link, #icons li" ).hover(
    function() {
        $( this ).addClass( "ui-state-hover" );
    },
    function() {
        $( this ).removeClass( "ui-state-hover" );
    }
);

$('#calendar').fullCalendar({
    dayClick: function(date, jsEvent, view) {

            }
});

$(document).keydown(function(e) {
    switch(e.keyCode) {
                case 33: // page up
        $('#calendar').fullCalendar('prev');
                break;

                case 34: // page down
        $('#calendar').fullCalendar('next');
                break;

                case 37: // left
//     alert('left key pressed');
            $('#calendar').fullCalendar('gotoDate', '2015-01-19');
                $(this).css('background-color', 'red');
                break;

        case 38: alert('up key pressed');        
                //$('#calendar').fullCalendar('incrementDate', 'days:-7');
                break;

        case 39:
        //$('#calendar').fullCalendar('incrementDate', 'days:1');
                $('#calendar').fullCalendar('gotoDate','2015-03-19');
                $(this).css('background-color', 'red');

                                break;

        case 40: alert('down key pressed');
        //$('#calendar').fullCalendar('incrementDate', 'days:7');
                break;

        default: return; // exit this handler for other keys
    }
    e.preventDefault(); // prevent the default action (scroll / move caret)
        });

        });
第二个参数应为矩.duration对象,而不是生成矩的字符串。您可以看到如何构建duration对象

我想如果你改变的话,应该可以

 //$('#calendar').fullCalendar('incrementDate', 'days:7');


雷沃先生,您说得对,代码现在在浏览器中运行。我仍然需要突出显示我移动到的单元格。颜色bce8f1。我试过$this.addClass fc highlight;但没有效果。如果我用鼠标选择一个月的第20天,然后按向上箭头键3次,口译员似乎理解了日期,第三次按时它会转到上个月,但我仍然无法像鼠标单击那样突出显示日期。谢谢你的努力。我会挺身而出。欢迎遗嘱。关于亮点。。。看看好的,在马里奥的帮助下,我在过去几天里取得了相当大的进步。当我使用var today=$'calendar'.fullCalendar''d'应用格式时,有一个矩日期对象的属性(其值为我想要的日期{Wed Feb 18 2015 19:00:00 GMT-0500 Eastern Standard Time});momenttoday.格式为'yyyy-MM-dd';我得到的是默认日期的_I值,例如2015-02-12,而不是2月18日。如果有价值的话,我可以提供更多的代码。谢谢-所有的评论,我想你的新问题超出了这个范围。也许你应该用你的MomentJS问题提出一个新问题。我想更多的人可以帮助你。谢谢你的帮助。如果其他人觉得它有用,这里有一段代码介绍它是如何工作的。您必须访问矩对象的_d属性。还有更多,但我已经越过了那座桥。$'calendar'.fullCalendar'incrementDate',moment.duration7',days';var j=$'calendar'.fullCalendar'getDate';var ja=j._dvar k=momentja.formatYYYY-MM-DD;$'calendar'.fullCalendar'select',k;$'this'.css'background-color','bce8f1';$'this'.addClass fc高亮显示;打破
 $('#calendar').fullCalendar('incrementDate', moment.duration(7, 'days'));