Datei-Upload leeren | CSS-Tricks

Sie können es einfach klonen und durch sich selbst ersetzen, wobei alle Ereignisse angehängt bleiben.

var input = $("#control");

function something_happens() {
    input.replaceWith(input.val('').clone(true));
};

Kommentare

Sreekanth

# 16. Januar 2013

Wenn man auf die Schaltfläche "Leeren" mehrmals klickt, funktioniert es nicht.

Antworten

Karan Menon

# 27. März 2013

Funktioniert nicht...

Antworten

Tobias

# 5. April 2013

Hier auch, das Beispiel funktioniert nur beim ersten Mal.
Das Auswählen einer anderen Datei gibt "changed" in der Konsole aus, aber das Klicken auf den "Leeren"-Link tut nichts.
Win7/Chrome 26

Antworten

dibiler

# 21. August 2013

Ich glaube, dass es nicht funktioniert, weil die Variable "controlBn" nur einmal zugewiesen wird (beim ersten Mal ist sie gleich $(‘#control‘). Da dieses Element durch einen neuen Klon davon ersetzt wird, zeigt die Variable "controlBn" möglicherweise nach dem Ersetzen auf ein nicht vorhandenes Element.
Ich würde nur
$('#clear').on('click' ,function(){ $('#control').replaceWith( $('#control').val('').clone( true ) ); });
statt des obigen Codes schreiben
(nur eine Vermutung)

Antworten

niwtsew

# 3. September 2013

.val(‘‘) funktioniert zwar für FF, aber nicht für IE.

Antworten

Praveenkumar

Permalink zum Kommentar# 22. Februar 2017

.val(‘‘) funktioniert nicht in IE11. Können wir .value = null; setzen? Funktioniert das für IE11?

Trevor

# 20. September 2013

Danke. Genau das, was ich brauchte. Funktioniert perfekt ;)

Antworten

Jesin

# 28. Februar 2014

Die Lösung von @dibiler funktioniert hervorragend. Die Variable control muss innerhalb der click Callback-Funktion neu initialisiert werden.

clearBn.on("click", function(){
    var control = $("#control");
    control.replaceWith( control.val('').clone( true ) );
});

Eine funktionierende Demo ist hier verfügbar – http://jsfiddle.net/jesin/FEKrz/

Antworten

Pablo

# 1. April 2014

Fantastisch!

Antworten

Ibrahim Islam

# 19. September 2014

Großartig!

Antworten

ETorres

# 16. Oktober 2014

Hey… es ist großartig! Aber es funktioniert nicht für den DATEITYP :-(

Antworten

Muhamad Risman

# 8. Oktober 2015

Danke, sehr hilfreich für mich :)

Antworten

Qaisar Khan

# 1. Januar 2016

Ich sehe Leute, die sich darüber beschweren, dass der Leeren-Button mehr als einmal nicht funktioniert…
Wie wäre es mit einer viel einfacheren Lösung, wie zum Beispiel

document.getElementById(“control”).value = “”;

Antworten

Enmanuelle Acuña

Permalink zum Kommentar# 12. April 2016

Perfekt!!!!

Stan

# 10. Januar 2016

@Qiasar = du bist der Beste :)

Antworten

Darbez

# 20. Januar 2016

$(“#clear”).click(function(){
$(“#control”).val(”);
});

Ist falsch????

Antworten

jeff

Permalink zum Kommentar# 5. Februar 2017
@Darbez

Moment mal, sagst du
```
$(“#clear”).click(function(){
    $(“#control”).val(”);
});
```
ist falsch, oder fragst du?

Weil ich frage. Ist etwas falsch daran, es auf diese Weise zu tun?

Maxmaxmaximus

# 10. Februar 2016

ie-8 Unterstützung, viel Spaß =) mein Name ist Maxmaxmaximus

input.value = ''
input.type = ''
input.type = 'file'

Antworten

lyc4n

# 23. März 2016

Das Formular leeren

$(".user-form").get(0).clear()

Antworten

Matic Pogladič

# 26. Mai 2017

Leute, dieser Code funktioniert

$('#btn-example-file-reset').on('click', function(e){
   var $el = $('#example-file');
   $el.wrap('<form>').closest('form').get(0).reset();
   $el.unwrap();
});

Antworten

Thiru

# 19. Dezember 2017

document.getElementById(“control”).value = “”;

Antworten

Jonn Jasper Ejoc

# 29. Mai 2018

Das funktioniert für mich

$(‘#control’).val(”);

Antworten

Arsenii

# 25. Juni 2019

Danke! Funktioniert für mich!

Antworten

SNikhill

# 18. September 2021

Ich neige dazu, FileInput zurückzusetzen, indem ich die files-Eigenschaft auf eine leere FileList zurücksetze.

[inputTypeFile].files = new DataTransfer().files

wobei [inputTypeFile] = HTMLInputElement vom Typ Datei ist.

Antworten

Kommentare

Antwort hinterlassen Antwort abbrechen