在滴管插件中删除图像预览 jquery

Question

我一直在尝试使用 ajax 制作一个拖放图像字段以上传到服务器。我浏览了一些 Jquery 插件，发现 Dropper 插件可以 help.I 像这样尝试。

HTML

 <div class="target"></div>
    <img>

JS

 $(".target").dropper({
        action: "upload.php",

    }).on("start.dropper", onStart);
    function onStart(e, files){
    console.log(files);
        $('.dropper-dropzone').css("background-color", "yellow");

        $('img').attr({src:files[0].name});
    }

但我没能在滴管上预览滴管图像。 jsfiddle demo

Answer 1

@tvshajeer 我做了一个图像预览功能，它同时支持 gecko 和 webkit 浏览器，如果不支持，它会向您发送错误消息。

 image_preview(files[0].file).then(function(res){
        $('img').attr({src:res.data});
        });

查看我在 fiddle 上的回答： http://jsfiddle.net/v8pqsczz/1/

在滴管插件中删除图像预览 jquery

Dropped image preview in dropper plugin jquery

javascript

jquery

upload

drag-and-drop