How to cancel file upload html?

Question

I am using an input element with type="file" and I want to cancel selection of something I choose.

I tried using

document.getElementById("pic1").value="";
document.getElementById("pic1").src="";

But it works only on Firefox.

Does anyone has a solution that works in IE and Chrome? Please no JQuery.

Answer 1

This works in jsFiddle

• Google Chrome 29

JavaScript:

$("#cancel").click(function(){
 document.getElementById("test").value = "";   
})

Here is a similar question: Clearing file input box in Internet Explorer

It's readonly in IE8 onwards, so you can't clear it. The simplest way around this security feature is to replace the element with a copy.

And here is a dirty solution to your problem jsFiddle from the same question:

JavaScript:

$("#cancel").click(function () {
    document.getElementById('test').parentNode.innerHTML = document.getElementById('test').parentNode.innerHTML;
})

It's dirty because it shouldn't work.