cari
Rumahhujung hadapan webSoal Jawab bahagian hadapanBagaimana untuk mendapatkan status halaman anak dalam halaman induk dalam javascript

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
CSS: Bolehkah saya menggunakan pelbagai ID dalam DOM yang sama?CSS: Bolehkah saya menggunakan pelbagai ID dalam DOM yang sama?May 14, 2025 am 12:20 AM

Tidak, youdouldn'tusemultipleidsinthesamedom.1) idsmustbeuniquperhtmlspecification, andingduplicatescancauseonsistentbrowsbehavior.2)

Tujuan HTML5: Mewujudkan Web yang lebih kuat dan boleh diaksesTujuan HTML5: Mewujudkan Web yang lebih kuat dan boleh diaksesMay 14, 2025 am 12:18 AM

Html5aimstoenhanceWebcapabilities, makeitmoredynamic, interaktif, dan boleh diakses.1) itsupportsmultimeDiaelementsLikeand, menghapuskanTheTheneedforplugins.2) semantikelementsImproveAccessibilityandcodeReadability.3) Ciri -ciri

Matlamat penting HTML5: Meningkatkan Pembangunan Web dan Pengalaman PenggunaMatlamat penting HTML5: Meningkatkan Pembangunan Web dan Pengalaman PenggunaMay 14, 2025 am 12:18 AM

Html5aimstoenhancewebdevelopmentanduserexperiencetroughsemanticstructure, multimediaintegration, andperformanceimprovements.1)

HTML5: Adakah ia selamat?HTML5: Adakah ia selamat?May 14, 2025 am 12:15 AM

Html5isnotinherentlyinsecure, butitsfeaturescanleadtosecurityriskssifmisusedorimproperlyimplemented.1) usethesandboxattributeiniframestocontrolembeddedcontentandpreventvulnerabilitieSlIKeClickjacking

Matlamat HTML5 berbanding dengan versi HTML yang lebih lamaMatlamat HTML5 berbanding dengan versi HTML yang lebih lamaMay 14, 2025 am 12:14 AM

Html5aimedtoenhanceWebdevelopmentbyintroducingsemanticelements, nativemultimediasupport, peningkatan prestasi, danflineCapabilities, kontrasingwiththelimitationsofhtml4andxhtml.1) iTintroducedSemanTictagsike,

CSS: Adakah buruk menggunakan pemilih ID?CSS: Adakah buruk menggunakan pemilih ID?May 13, 2025 am 12:14 AM

Menggunakan pemilih ID tidak sememangnya buruk dalam CSS, tetapi harus digunakan dengan berhati -hati. 1) Pemilih ID sesuai untuk elemen unik atau cangkuk JavaScript. 2) Untuk gaya umum, pemilih kelas harus digunakan kerana ia lebih fleksibel dan dapat dipelihara. Dengan mengimbangi penggunaan ID dan kelas, seni bina CSS yang lebih mantap dan cekap dapat dilaksanakan.

HTML5: Matlamat pada tahun 2024HTML5: Matlamat pada tahun 2024May 13, 2025 am 12:13 AM

Html5'sgoalsin2024focusonrefinementandoptimization, notnewfeatures.1) enhanceperformanceandeficiencythroughoptimizedrendering.2) ImproveAccessibilityWithreFinedAttributeseMelements.3)

Apakah kawasan utama di mana HTML5 cuba memperbaiki?Apakah kawasan utama di mana HTML5 cuba memperbaiki?May 13, 2025 am 12:12 AM

Html5aimedtoimproveWebdevelopmentinfourkeyareas: 1) Multimediasupport, 2) Semantik, 3) Formcapabilities, dan4) OfflineandStorageOptions.1)

See all articles

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

Video Face Swap

Video Face Swap

Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Artikel Panas

Nordhold: Sistem Fusion, dijelaskan
4 minggu yang laluBy尊渡假赌尊渡假赌尊渡假赌
Mandragora: Whispers of the Witch Tree - Cara Membuka Kunci Cangkuk Bergelut
3 minggu yang laluBy尊渡假赌尊渡假赌尊渡假赌

Alat panas

SublimeText3 versi Inggeris

SublimeText3 versi Inggeris

Disyorkan: Versi Win, menyokong gesaan kod!

SecLists

SecLists

SecLists ialah rakan penguji keselamatan muktamad. Ia ialah koleksi pelbagai jenis senarai yang kerap digunakan semasa penilaian keselamatan, semuanya di satu tempat. SecLists membantu menjadikan ujian keselamatan lebih cekap dan produktif dengan menyediakan semua senarai yang mungkin diperlukan oleh penguji keselamatan dengan mudah. Jenis senarai termasuk nama pengguna, kata laluan, URL, muatan kabur, corak data sensitif, cangkerang web dan banyak lagi. Penguji hanya boleh menarik repositori ini ke mesin ujian baharu dan dia akan mempunyai akses kepada setiap jenis senarai yang dia perlukan.

Pelayar Peperiksaan Selamat

Pelayar Peperiksaan Selamat

Pelayar Peperiksaan Selamat ialah persekitaran pelayar selamat untuk mengambil peperiksaan dalam talian dengan selamat. Perisian ini menukar mana-mana komputer menjadi stesen kerja yang selamat. Ia mengawal akses kepada mana-mana utiliti dan menghalang pelajar daripada menggunakan sumber yang tidak dibenarkan.

Muat turun versi mac editor Atom

Muat turun versi mac editor Atom

Editor sumber terbuka yang paling popular

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma