How Can I Clear a File Input Field's Value Using jQuery?

Clearing using jQuery

Facing challenges in clearing the value of an element? jQuery provides a solution for this task.

While setting $('#control').attr({ value: '' }); may seem like a straightforward approach, it doesn't yield the desired result. A more effective method involves wrapping the element within a

element and then employing the .reset() function on the form. Subsequently, remove the added form using .unwrap().

window.reset = function(e) {
  e.wrap('<form>').closest('form').get(0).reset();
  e.unwrap();
};

This approach has been tested and confirmed to work effectively across various browsers, including Opera, Firefox, Safari, Chrome, and IE6 . It also operates successfully with other form element types, except for those with type="hidden".

To showcase its functionality, the following HTML and JavaScript code can be used:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<form>
  <input>

The above is the detailed content of How Can I Clear a File Input Field's Value Using jQuery?. For more information, please follow other related articles on the PHP Chinese website!