从IE中的输入类型=文件中删除所选文件

时间:2015-06-18 13:15:52

标签: jquery internet-explorer show-hide

如何在IE中清除所选文件

以下示例适用于Chrome但不适用于IE(任何版本)

http://jsfiddle.net/nfvR9/1/

HTML

<input id="file1" type="file" class="" multiple="" required="" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" />

Jquery的

$("#fileUpload").val('');

正如预期的那样,IE不支持这一点。

5 个答案:

答案 0 :(得分:1)

我最终做如下:

function reset_form_element(e) {
            e.wrap('<form>').parent('form').trigger('reset');
            e.unwrap();
        }

然后调用函数如下:

reset_form_element($('#file1'));

答案 1 :(得分:1)

输入文件列表是只读的,因此您无法从中删除任何文件,这就是IE不支持清除输入值的原因。

答案 2 :(得分:1)

我会扩展jQuery以获得“clearFiles”的方法。 jQuery使用1.9来贬低jQuery.browser,这就是为什么我要检查浏览器是否带有变量的IE。

功能扩展:

$.fn.extend({
    clearFiles: function () {
        $(this).each(function () {
            var isIE = (window.navigator.userAgent.indexOf("MSIE ") > 0 || !! navigator.userAgent.match(/Trident.*rv\:11\./));
            if ($(this).prop("type") == 'file') {
                if (isIE == true) {
                    $(this).replaceWith($(this).val('').clone(true));
                } else {
                    $(this).val("");
                }
            }
        });
        return this;
    }
});

使用:

$('#test').click(function () {
    $("[type='file']").clearFiles();
});
这是一个小提琴。 fiddle

答案 3 :(得分:0)

您可以在IE下面找到解决方法

$("#image").remove("");
$("form").append(' <input id="image" type="file" name="image"/>');

小提琴 - http://jsfiddle.net/nfvR9/25/

答案 4 :(得分:0)

非常感谢Amit.rk3的回答,我修改了他的回答(我会在评论中加注,但我没有50分!!)。 OP确实说清除了一个选定的文件,所以我将假定一个输入。我的页面相当长而且很复杂,所以我想非常具体地说明要重置的输入。.下面的代码在IE(8)和FF ​​ESR上很完美:)

Select Photo(optional): <span id="form_sp"><input id="file" type="file" size="40" name="photo"/></span> <button id="reset_t">Reset file</button>

<script>
$(document).ready(function(){
    $('#reset_t').click(function(e) {
        e.preventDefault(); // keeps form from submitting
        $("#form_sp").html('');
        $("#form_sp").html('<input id="file" type="file" size="40" name="photo"/>');
    });
});
</script>