Heim > Web-Frontend > Front-End-Fragen und Antworten > So erhalten Sie den Status einer untergeordneten Seite auf einer übergeordneten Seite in Javascript

So erhalten Sie den Status einer untergeordneten Seite auf einer übergeordneten Seite in Javascript

PHPz
Freigeben: 2023-04-25 18:54:25
Original
811 Leute haben es durchsucht

Bei der Webentwicklung kommt es häufig vor, dass eine übergeordnete Seite eine untergeordnete Seite öffnet. Wenn die untergeordnete Seite geschlossen wird, müssen einige Vorgänge ausgeführt werden, z. B. das Aktualisieren der übergeordneten Seite usw. Beim Schreiben von Webanwendungen mit JavaScript müssen wir wissen, wie wir den Status der Unterseite auf der übergeordneten Seite abrufen, damit wir entsprechende Vorgänge ausführen können.

In JavaScript können Sie das Fensterobjekt zum Öffnen und Schließen von Seiten verwenden. Wenn wir eine neue Seite öffnen, können wir die Methode window.open() verwenden. Diese Methode akzeptiert drei Parameter. Der erste Parameter ist die Adresse der zu öffnenden Seite, der zweite Parameter ist der Name des Fensters und der dritte Parameter sind die Eigenschaften des Fensters.

Zum Beispiel öffnet der folgende Code ein neues Fenster und setzt den Fensternamen auf „myWindow“:

var myWindow = window.open("http://www.example.com", "myWindow", "width=500,height=500");
Nach dem Login kopieren

Wenn wir erfahren möchten, ob die Unterseite geschlossen ist, können wir das Fensterobjekt der Unterseite verwenden. Auf einer Unterseite können Sie mithilfe des window.onunload-Ereignisses erkennen, ob die Seite geschlossen wurde. Beim Schließen der Seite kann eine Nachricht an die übergeordnete Seite gesendet werden.

Hier ist ein JavaScript-Codebeispiel für eine untergeordnete Seite:

window.onunload = function() {
    window.opener.postMessage("childClosed", "*");
}
Nach dem Login kopieren

In diesem Beispiel wird beim Schließen der untergeordneten Seite eine Nachricht mit dem Namen „childClosed“ an die übergeordnete Seite gesendet. Der Parameter der Nachricht ist eine Zeichenfolge, die beliebig sein kann. Der zweite Parameter ist ein Quellparameter, der den Absender der Nachricht angibt.

Auf der übergeordneten Seite können Sie einen Ereignis-Listener hinzufügen, um Nachrichten von der untergeordneten Seite zu akzeptieren. Beim Empfang einer Nachricht können entsprechende Aktionen durchgeführt werden. Hier ist ein Beispielcode:

window.addEventListener("message", receiveMessage, false);

function receiveMessage(event) {
    if (event.data === "childClosed") {
        // 子页面已关闭,执行相应操作
    }
}
Nach dem Login kopieren

In diesem Code wird beim Empfang einer Nachricht eine Funktion namens „receiveMessage“ aufgerufen. Überprüfen Sie in dieser Funktion, ob es sich bei der Nachricht um eine „childClosed“-Zeichenfolge handelt, und führen Sie in diesem Fall den entsprechenden Vorgang aus.

Um mit JavaScript auf der übergeordneten Seite zu ermitteln, ob die untergeordnete Seite geschlossen ist, müssen wir im Allgemeinen einen Ereignis-Listener auf der untergeordneten Seite hinzufügen, um die Nachricht zu senden, und dann einen Ereignis-Listener auf der übergeordneten Seite hinzufügen, um die Nachricht zu empfangen Nachricht und führen Sie den entsprechenden Vorgang aus.

Das obige ist der detaillierte Inhalt vonSo erhalten Sie den Status einer untergeordneten Seite auf einer übergeordneten Seite in Javascript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

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