Frage Problem beim Hochladen von Dateien


Ich habe das folgende Markup:

  <select multiple="multiple" id="targetFilesList"  style="width:200px;height:110px;">
   </select>
   <input type="button" value="Get" id="btnGet" />

und folgendes Javascript:

    $(function()
    {
        $('#btnGet').click(function()
        {
            var fileupload = $("<input type='file' name='filetoupload' style='visibility:hidden;'/>");
            $('body').append(fileupload);

            fileupload[0].onchange = function()
            {
                $('#targetFilesList').append('<option >' + fileupload.val() + '</option>');
                return false;
            }
            fileupload.click();
        });
    });

Szenario ist, dass ich mehrere Dateien hochladen muss und sobald Benutzer die Datei gewählt hat, um hochgeladen zu werden, muss ich den Dateinamen dem Benutzer zeigen. Dann, beim Übermitteln des Formulars werde ich alle Dateien hochladen. Dafür klicke ich auf die Schaltfläche "Erhalten" Ich füge ein Dateiupload-Steuerelement dynamisch hinzu und initialisiert das onchange-Ereignis des gerade hinzugefügten Dateiupload-Steuerelements. Das Problem in Chrome 12 beim Klicken auf Buttonupload-Steuerelement wird nicht geöffnet, aber in Firefox4 und IE8 funktioniert es. Irgendeine Idee warum?


12
2018-06-09 16:53


Ursprung


Antworten:


Damit es in Chrome 12 funktioniert, können Sie es einfach in ein Fenster-Timeout von 0 wie folgt einfügen:

window.setTimeout(function(){
   fileupload.click();   
},0);

Warum genau es sich so verhält, bin ich nicht sicher. Das erste Mal, als ich auf das Problem stieß, probierte ich es mit einem längeren Intervall und reduzierte es ständig, um zu sehen, wie niedrig Sie es bekommen konnten, bis ich bemerkte, dass es nicht einmal eine Verzögerung brauchte. Die offensichtliche Antwort wäre, dass es in DOM zu dem Zeitpunkt nicht wirklich fertig ist, zu dem Sie den Klick auslösen (Element ist da, aber sind die passenden Ereignisse dafür?).

Beispiel: http://jsfiddle.net/HgEga/


17
2018-06-14 13:19



Diese Art von Code selbst zu tun, kann ein Schmerz sein. Vielleicht einen Blick auf ein vorhandenes jQuery-Plugin zum Hochladen mehrerer Dateien wird helfen.


0
2018-06-20 17:02