jQuery-重置更改事件

Question

我正在使用输入文件，因此当我上传图片然后将其删除时，我无法再次上传同一张图片，只能上传另一张图片

addimg ：

obj2.on('change', function(e){
    e.stopPropagation();
    e.preventDefault();
    $(this).css('border',"4px dotted #bdc3c7");
    var objid = $(this).parents('.drop').attr("id");
    var files = e.target.files;
    var file = files[0];
    if (files && files[0]) {
        var reader = new FileReader();
        reader.onload = function (e) {
            $("#" + objid).find(".addCont").css('visibility', 'hidden');
            $("#" + objid).css('background-image', 'url(' + e.target.result + ')');
            $("#" + objid).find('.imgmenucontainer').css('visibility', 'visible'); 
        }
    reader.readAsDataURL(files[0]);
    }
});

删除 ：

$(".custombtnremove").click(function(){
    var objid = $(this).parents('.drop').attr('id');
    $("#" + objid).css('background-image', '');
    $("#" + objid).find('.imgmenucontainer').css('visibility', 'hidden');
    $("#" + objid).find(".addCont").css('visibility', 'visible');
});

所以我认为它一定与变更事件有关

Answer 1

删除图像后清空输入文件。

$(".custombtnremove").click(function(){
    //previous code here
    //reset input file
    $(obj2).val(""); //-> or obj2.val(""); if obj2 is already a jquery object.
});

Answer 2

您是否尝试过这种情况？：

1. upload file A
2. remove file A
3. upload file B
4. remove file B
5. upload file A

如果工作正常，则必须添加remove事件：

$(obj2).val("");

原因是您不更改数据以与之前的相同数据进行比较...井事件change未触发。 解决方案：删除后-将数据设置为空，然后一切正常。 在change事件中，您可以为""值添加附加条件。