javascript - 如何致富：上传接受从文件夹中拖放文件？

Question

我已经使用rich:upload 标签实现了文件上传，现在新的要求是让它接受从文件夹中拖放文件，然后触发文件上传过程。

我的问题是如何实现这个？不管 Html5、jQuery 等，只要实现它。

如果它可以集成到richfaces，例如，一旦收到拖动事件，我可以触发rich:upload 与jQuery 等类似的东西，这是最好的。

项目web框架为richfaces + jsf。

先感谢您。

补充：这里是一个jquery文件上传demo

Answer 1

这里有一个示例，展示了如何使用File API。

基本上，您必须使用ondrop事件和FileReader对象：

<div id='holder'></div>
<script>
    var holder = document.getElementById('holder');
    holder.ondrop = function (e) {
        var file = e.dataTransfer.files[0],
            reader = new FileReader();

        reader.onload = function (event) {
            // your file info
            console.log(event.target);
        };

        // do read
        reader.readAsDataURL(file);

        return false;
    };
</script>