Safari jQuery on('drop') 无法处理文件

Question

我正在尝试将文件放入我网站上的文件夹中。它在 chrome 中完美运行，但该事件不会在 safari 中触发。我似乎可以通过文件触发 drop 事件。虽然如果我在网站中拖放元素它会起作用。

            $(document).on('dragstart', '.mtdrg', dragStart);
            $(document).on('dragenter', '.mtdrp', dragEnter);
            $(document).on('dragover', '.mtdrp', dragOver);
            $(document).on('dragleave', '.mtdrp', dragLeave);
            $(document).on('drop', '.mtdrp', drop);
            $(document).on('dragend', '.mtdrp', dragEnd);

    dragStart = function (e) {
        var element = $(this),
            instanceid = element.data('instanceid'),
            entitytype = element.data('entitytype'),
            vmtype = element.data('vmtype');

        if (!isAnyMoveAllowed(entitytype, vmtype)) {
            e.preventDefault();
            return false;
        }

        $(document.documentElement).addClass('dragActive');

        origBackgroundColor = $(this).css('backgroundColor');

        this.style.opacity = 0.8;
        this.style.backgroundColor = 'rgba(0, 161, 255,.75)';

        e.originalEvent.dataTransfer.effectAllowed = 'move';

        setDragData(instanceid, entitytype, vmtype);
    };

    dragOver = function (e) {
        if (e.preventDefault) {
            e.preventDefault(); // Necessary. Allows us to drop.
        }

        $(document.documentElement).addClass('dragActive');

        var targetEntityType = $(this).data('entitytype');
        var targetViewModelType = $(this).data('vmtype');

        if (isMoveAllowed(targetEntityType, targetViewModelType, e)) {
            e.originalEvent.dataTransfer.dropEffect = 'move';
        } else {
            e.originalEvent.dataTransfer.dropEffect = 'none';
        }

        return false;
    };

    dragEnter = function () {
        $(this).addClass('mtdrpHover');
    };

    dragLeave = function () {
        $(this).removeClass('mtdrpHover');
    };

    drop = function (e) {
        if (e.stopPropagation) {
            e.stopPropagation(); // stops the browser from redirecting.
        }

        if (e.originalEvent.dataTransfer.types != null) {
            if (e.originalEvent.dataTransfer.files.length > 0) {

                $(document.documentElement).removeClass('dragActive');
                $(this).removeClass('mtdrpHover');

                performFileDrop($(this).data('instanceid'), e);
                return false;
            }
        }

        var x = e.originalEvent.offsetX;
        var y = e.originalEvent.offsetY;

        performDrop($(this).data('instanceid'), $(this).data('dropcontroller'), $(this).data('dropaction'), x, y);

        return false;
    };

Answer 1

我需要停止传播并防止在几个事件中出现默认值才能正常工作。

    dragOver = function (e) {
        if (e.preventDefault) {
            e.preventDefault(); // Necessary. Allows us to drop.
            e.stopPropagation();
        }
    };

    dragEnter = function (e) {
        e.preventDefault();
        e.stopPropagation();

        $(this).addClass('mtdrpHover');
    };

    drop = function (e) {
        if (e.stopPropagation) {
            e.preventDefault();
            e.stopPropagation(); // stops the browser from redirecting.
        }
    };

Safari jQuery on('drop') 无法处理文件

Safari jQuery on('drop') not working with files

javascript

safari

jquery