Question

为标题道歉。以下是我的问题：

从用户计算机中选择图像文件时，我已经DIY了一个图像缩略图，可以选择删除所选图像并选择一个新图像。

当我点击上传按钮时，它上传了我上次选择的相同图片。我不明白的是，如果我在上传之前点击了删除图片按钮，为什么它还有图像？

以下是我的HTML代码：

<input id="trip-photo1" type="file" class="trip-ul-photo-img" name="trip-photo[]">
<label for="trip-photo1"></label>

以上是我输入的5个输入中的1个。

以下是我的jQuery代码：

$(document).on('change', 'input.trip-ul-photo-img', function(){
        var photo_wrapper       =   $(".trip-ul-photo"); //Fields wrapper
        var photo_button        =   $(".btn-trip-ul-photo"); //Add button ID
        var reader              =   new FileReader();
        var photo               =   $(this);
        var btn_str             =   '';
            btn_str             +=  '<button type="button" class="btn btn-link btn-photo-del" role="button">X</button>';

        reader.onload = function (e) {
            // get loaded data and render thumbnail.
            var img_str     =   '';
                img_str     +=  '<img class="pro-set-up-photo-preview" src="' + e.target.result + '" />'
            photo.parent().append(img_str, btn_str);
        };

        // read the image file as a data URL.
        reader.readAsDataURL(this.files[0]);

    });

    $(document).on('click', '.btn-photo-del', function(){
        $(this).parent(".trip-ul-photo-group").next(".trip-ul-photo-cap-wrapper").children("input, p").remove();
        $(this).parent(".trip-ul-photo-group").children("img, button").remove();
    });

我完全不知道发生了什么，因为这也是我第一次自己DIY删除所选图像。

先谢谢你们！

Answer 1

问题解决了。问题在于，只要您选择任何文件，这就是文件输入的默认行为。删除预览图像时，只需将数据设置为空。

即使在提交表单之前删除了图像数据，它仍然存在

1 个答案: