Laden Sie Dateien ohne Aktualisierung hoch und geben Sie benutzerdefinierte Werte zurück

In diesem Artikel erfahren Sie kurz, wie Sie das Problem des Hochladens von Dateien ohne Aktualisierung in persönlichen Projekten lösen können. Freunde in Not können sich darauf beziehen.

Ich bin heute während des Entwicklungsprozesses auf ein solches Problem gestoßen: Excel muss zum Parsen auf den Server hochgeladen werden, aber wenn das Dokument ungeeignet ist, hoffe ich, dass die Seite nicht aktualisiert wird, um den Benutzer darauf hinzuweisen Dokument ist unangemessen. Nach langem Nachdenken habe ich viele Informationen im Internet gefunden und das Experiment ist mir schließlich gelungen. Die Verarbeitungsmethode teile ich hier:

Lassen Sie mich zunächst über die Verarbeitungsidee sprechen: Fügen Sie der Seite einen versteckten Iframe hinzu und legen Sie das Zielattribut des Formulars auf die ID des Iframes fest, sodass die Excel-Datei beim Absenden des Formulars in Form eines Dateistreams an den Hintergrund übertragen wird Vorgänge können im Hintergrund ausgeführt werden, ohne dass die zurückgegebenen Informationen im Iframe angezeigt werden. Auf „Ausgeblendet“ gesetzt, sodass sich die Seite nicht ändert. Anschließend müssen wir die Änderungen im Iframe überwachen Übergeben Sie den Inhalt an die JS-Methode im Hauptfenster für den nächsten Schritt der benutzerdefinierten Verarbeitung.

Der Seitencode lautet wie folgt:

<form id="input" action="importExcel.jhtml" method="post" enctype="multipart/form-data" target="hiddenIFrame">
　　<input id="excelFile" name="file" type="file" />
　　<input type="submit" class="button" value="导入excel"/>
</form>
<iframe id=&#39;hiddenIFrame&#39; name=&#39;hiddenIFrame&#39; style="display:none;"></iframe>

Der JS-Code lautet wie folgt (jqeury muss eingeführt werden):

$(function(){
  $("#hiddenIFrame").load(function(){
    var wnd = this.contentWindow;
    var str = $(wnd.document.body).html();
    callback(str);
  });
})
 
function callback(info){
  alert(info);
}

Der Hintergrundcode wird nicht im Detail eingeführt. Genau wie bei der herkömmlichen Übermittlung erhält der Hintergrund einen Dateistream mit demselben Namen basierend auf dem Namenswert der Eingabekomponente (z Beispielsweise lautet der Name der Eingabekomponente im obigen Seitencode „Datei“ und der empfangene Hintergrund ist ein Dateistream mit dem Namen „Datei“. Nach dem Empfang können Sie benutzerdefinierte Vorgänge ausführen.

Weitere verwandte Tutorials finden Sie unter JavaScript-Tutorial