Question

下拉不在完整日历单元格中工作。这是我的代码http://jsfiddle.net/3E8nk/1454/

在此单击下拉列表时，选项不会出现

$('#calendar').fullCalendar({
    header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
    },
    defaultDate: '2014-06-12',
    editable: true,
    eventRender: function(event, element, view) {  

        return $('<div>' + event.title + '</div>');  
    },

    events: [
        {
            title: '<select id="drp"><option>Volvo</option><option value="saab">Saab</option><option value="opel">Opel</option><option value="audi">Audi</option></select>',
            start: '2014-06-01'
        },
        {
            title: 'Long Event',
            start: '2014-06-07',
            end: '2014-06-10'
        },
        {
            id: 999,
            title: 'Repeating Event',
            start: '2014-06-09T16:00:00'
        },
    ]
});

Answer 1

您可以将其视为fullcalendar中的错误。正是这段代码窃取了点击：

    element
        .mousedown(function(ev) { // prevent native <a> selection for others
            ev.preventDefault();
        })
        .click(function(ev) {
            if (isResizing) {
                ev.preventDefault(); // prevent link from being visited (only method that worked in IE6)
                ev.stopImmediatePropagation(); // prevent fullcalendar eventClick handler from being called
                                               // (eventElementHandlers needs to be bound after resizableDayEvent)
            }
        });

要解决此问题，您可以设置editable: false，resizable: false。

作为一种解决方案，您可以在完全初始化fullcalendar后在下拉列表中调用此方法，以防止click / mousedown到达附加有违规处理程序的div.ui-draggable。

$("#drp").on("mousedown click", function(event){event.stopPropagation()});

下拉列表无法在fullcalendar单元格

1 个答案: