Come cancellare l'input di file

Question

Di seguito è riportata una parte del codice jquery che contiene l'input del file e un pulsante "Cancella file".

var $imagefile = $('<input />').attr({ 
    type: 'file', 
    name: 'imageFile', 
    class: 'imageFile' 
}); 

$image.append($imagefile); 

var $imageclear = $('<input />').attr({ 
    type: 'button', 
    name: 'imageClear', 
    class: 'imageClear', 
    value: 'Clear File' 
}); 

$image.append($imageclear); 

Ora, la ragione ho il pulsante "Cancella File" è perché se si fa clic sul pulsante, allora sarà chiaro tutto ciò che è nel file di input. Come faccio a codificarlo in modo che cancelli effettivamente l'input del file quando clicco sul pulsante "Cancella file"?

Answer 1

questo dovrebbe funzionare:

$imageClear.on('click', function() { 
    $imageFile.val(''); 
}); 

Answer 2

Questo è il metodo che mi piace da usare come bene ma credo che è necessario aggiungere il vero parametro bool al metodo clone in modo che tutti gli eventi a rimanere attaccato con la nuovo oggetto e hai bisogno di cancellare il contenuto.

var input = $("#fileInput"); 

    function clearInput() { 
     input = input.val('').clone(true); 
    }; 

https://api.jquery.com/clone/

Answer 3

Questo funziona per

$("#yourINPUTfile").val(""); 

Answer 4

file di input chiaro con jQuery

$("#fileInputId").val(null); 

file di input chiaro con JavaScript

document.getElementById("fileInputId").value = null; 

Answer 5

ho fatto qualcosa di simile e che sta funzionando per me

$('#fileInput').val(null); 

Answer 6

Un'altra soluzione, se si vuole essere certi che questo è cross-browser in grado è quello di rimuovere() il tag e quindi aggiungere() o prepend() o in qualche altro modo aggiungere nuovamente una nuova istanza del tag di input con gli stessi attributi.

<form method="POST" enctype="multipart/form-data"> 
<label for="fileinput"> 
<input type="file" name="fileinput" id="fileinput" /> 
</label> 
</form> 

$("#fileinput").remove(); 
$("<input>") 
    .attr({ 
    type: 'file', 
    id: 'fileinput', 
    name: 'fileinput' 
    }) 
    .appendTo($("label[for='fileinput']"));