Jquery拖放上传而无需实际上传

时间:2013-07-12 19:20:26

标签: jquery plugins drag-and-drop

我正在寻找一个JQuery插件,允许我将文件拖放到div或其他东西,然后将文件名发送到我的后端应用程序(java)。

我找到的大多数插件上传文件,但我想要moviefiles的文件名(大小为4GB +),因此上传部分不是想要的功能。

所以回顾一下: 在html页面上传div,用户可以删除电影文件(mkv或avi),然后插件将删除文件的文件名发送到我的java后端。

1 个答案:

答案 0 :(得分:2)

您不需要插件。这是一个快速脚本,可以将文件名称拖入div:

http://jsfiddle.net/yfTfR/

$(document).ready(function () {

    $('#dropper').on('dragover', function (e) {
        e.preventDefault();
        e.stopPropagation();
    })

    $('#dropper').on('dragenter', function (e) {
        e.preventDefault();
        e.stopPropagation();
    })

    $('#dropper').on('drop', function (e) {
        e.preventDefault();

        var files = e.originalEvent.dataTransfer.files;
        for (i = 0; i < files.length; i++) {
            $('#fileList').append('<ul>' + files[i].name + '</ul>');
            // use ajax to send the filenames off to your server here
        }
    });
});