【问题标题】:fullcalendar events drag and drop not working in firefoxfullcalendar 事件拖放在 Firefox 中不起作用
【发布时间】:2015-09-17 15:06:59
【问题描述】:

拖放在其他浏览器上工作正常,只是 Firefox 有问题。

我已经阅读了足够多的内容,知道 Firefox 具有不同的拖放机制,但我发现没有任何帮助 尝试实施jsEvent.preventDefault(); 作为评论员建议here 但这并没有改变行为,我不确定如何实现标记为答案部分,这部分是 event.originalEvent.dataTransfer.setData('text/plain', 'anything');

这是我的拖放代码:

设置可拖动的tr

$('#workOrdersTable tbody tr').each(function() {
    var tds = $(this).children('td');
    if (tds.length > 0) {
        var workOrder = $.grep(workOrders, function(e) {
            return e.woNumber == tds[0].innerText;
        })[0];
        if (typeof workOrder !== "undefined" || workOrder !== null) { // store the Event Object in the DOM element so we can get to it later
            $(this).data('workOrder', workOrder);
            // make the event draggable using jQuery UI
            $(this).draggable({
                zIndex: 999,
                revert: true, // will cause the event to go back to its
                revertDuration: 0 //  original position after the drag
            });
        }

    }
});

我怎样才能让它在 Firefox 中工作?

FullCalendar 设置实现 drop

$('#calendar').fullCalendar({
    header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
    },
    editable: false,
    droppable: true,

    //edit existing
    eventClick: function(calEvent, jsEvent, view) {
        populateEvent(calEvent, true);
    },

    //create new
    drop: function(date, jsEvent, ui ) {
        //alert('jsEvent '+jsEvent);
        jsEvent.preventDefault();

        var workOrder = $(this).data('workOrder');
        workOrder.title = workOrder.woNumber + ' ' + workOrder.account
        workOrder.description = workOrder.problemDescription;
        workOrder.start = date;
        workOrder.end = moment(date).add(1, 'hour'); //change default so the start and end dont match
        populateEvent(workOrder, false);
    },

【问题讨论】:

  • 我也使用 Firefox 并且没有拖放问题。我只是在黑暗中拍摄,但是你对这个 d&d 也有问题吗?:jsfiddle.net/VjNFn/16

标签: javascript html firefox drag-and-drop fullcalendar


【解决方案1】:

问题在于将数据设置到可拖动行上

var workOrder = $.grep(workOrders, function(e) {
        return e.woNumber == tds[0].innerText;
    })[0];

需要

        var woNumberTemp = tds[0].textContent || tds[0].innerText;
        var workOrder = $.grep(workOrders, function(e) {
            return e.woNumber == woNumberTemp;
        })[0];

显然对于 chrome tds[0].innerText 很好,但 firefox 需要 tds[0].textContent

【讨论】:

    猜你喜欢
    • 2022-01-23
    • 1970-01-01
    • 1970-01-01
    • 2019-04-21
    • 2013-09-23
    • 2013-08-18
    • 2015-03-26
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多