Heim > Web-Frontend > js-Tutorial > Hauptteil

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

PHPz
Freigeben: 2018-10-12 15:56:51
Original
1206 Leute haben es durchsucht

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>
Nach dem Login kopieren

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);
}
Nach dem Login kopieren

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

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!