0

笔记:

下面的答案和评论反映了 2009 年旧版浏览器的状态。现在,您实际上可以在 2017 年使用 JavaScript 动态/编程地设置文件输入元素的值。

有关详细信息以及演示,请参阅此问题中的答案:
如何以编程方式设置文件输入值(即:拖放文件时)?

我正在尝试实现使用 Jquery 上传图像的拖放功能。

这是我的代码:

上传.html

    <form id ="image_upload_form" action="" method="post" enctype="multipart/form-data">

        <input id="id_image" type="file" name="image">
        <input type="submit" value="Upload" />

    </form>

    <div id="drop_field"></div>

image_upload.js

$(document).ready(function() {
    var drop_field = $("#drop_field");
    drop_field.bind('dragover', file_drag_over);
    drop_field.bind('drop', file_select);   
});



function file_select(event) {
    event.stopPropagation();
    event.preventDefault();

    var file = event.originalEvent.dataTransfer.files [0];
    $("#id_image").val(file);
}



function file_drag_over(event) {
    event.stopPropagation();
    event.preventDefault();

    event.originalEvent.dataTransfer.dropEffect = "copy";    
}

一切正常,除了当我将图像文件放到字段上时,它给了我一个安全错误:

SecurityError: The operation is insecure.
    this.value = val;

我猜这是因为我正在尝试修改文件输入字段的“值”属性。在不出现此安全错误的情况下上传文件的正确方法是什么?

谢谢!!

4

1 回答 1

2

该错误是因为您正在尝试设置文件输入类型的值,由于安全原因,无法设置文件输入类型的值。

另请阅读此问题和来自MDN

于 2013-08-19T07:16:45.323 回答