Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk mendapatkan status halaman anak dalam halaman induk dalam javascript

Bagaimana untuk mendapatkan status halaman anak dalam halaman induk dalam javascript

PHPz
PHPzasal
2023-04-25 18:19:08766semak imbas

Dalam pembangunan web, senario yang biasa digunakan ialah halaman induk membuka halaman anak Apabila halaman anak ditutup, beberapa operasi perlu dilakukan, seperti memuat semula halaman induk, dsb. Apabila menulis aplikasi web menggunakan JavaScript, kita perlu tahu cara mendapatkan status subhalaman dalam halaman induk supaya kita boleh membuat operasi yang sepadan.

Dalam JavaScript, anda boleh menggunakan objek tetingkap untuk membuka dan menutup halaman. Apabila kami membuka halaman baharu, kami boleh menggunakan kaedah window.open(). Kaedah ini menerima tiga parameter Parameter pertama ialah alamat halaman yang akan dibuka, parameter kedua ialah nama tetingkap, dan parameter ketiga ialah ciri tetingkap.

Sebagai contoh, kod berikut membuka tetingkap baharu dan menetapkan nama tetingkap kepada "myWindow":

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

Apabila kita ingin mengetahui sama ada subhalaman itu ditutup, kita boleh menggunakan subhalaman Objek tetingkap halaman. Dalam subhalaman, anda boleh menggunakan acara window.ounload untuk mengesan sama ada halaman tersebut telah ditutup. Apabila halaman ditutup, mesej boleh dihantar ke halaman induk.

Berikut ialah contoh kod JavaScript untuk halaman kanak-kanak:

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

Dalam contoh ini, apabila halaman kanak-kanak ditutup, ia menghantar mesej yang dipanggil "childClosed" ke halaman induk . Parameter mesej ialah rentetan, yang boleh menjadi apa sahaja. Parameter kedua ialah parameter sumber yang menentukan penghantar mesej.

Dalam halaman induk, anda boleh menambah pendengar acara untuk menerima mesej daripada halaman anak. Apabila mesej diterima, tindakan yang sesuai boleh dilakukan. Berikut ialah contoh kod:

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

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

Dalam kod ini, apabila mesej diterima, fungsi dipanggil receiveMessage dipanggil. Dalam fungsi ini, semak sama ada mesej itu adalah rentetan "childClosed", dan jika ya, lakukan operasi yang sesuai.

Secara umum, untuk menggunakan JavaScript dalam halaman induk untuk mengetahui sama ada halaman anak ditutup, kita perlu menambah pendengar acara dalam halaman anak untuk menghantar mesej, dan kemudian menambah pendengar acara dalam induk halaman untuk menerima mesej dan melakukan tindakan yang sesuai.

Atas ialah kandungan terperinci Bagaimana untuk mendapatkan status halaman anak dalam halaman induk dalam javascript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn