Buka popup dan segarkan halaman induk pada close popup


Jawaban:


233

Anda dapat mengakses jendela induk menggunakan ' window.opener ', jadi, tulis sesuatu seperti berikut di jendela anak:

<script>
    window.onunload = refreshParent;
    function refreshParent() {
        window.opener.location.reload();
    }
</script>

Saya tidak tahu window.opener, terima kasih! Saya selalu menempatkan jendela pemanggil dalam variabel di jendela konten anak. : - /
kay

3
Jika Anda tidak mengontrol JavaScript pada halaman anak (misalnya aliran OAuth) maka Anda perlu memeriksa popupWindow.closedpenggunaan setIntervallike dalam solusi @ Zuul.
jchook

34

Jendela pop-up tidak memiliki acara tutup apa pun yang dapat Anda dengarkan.

Di sisi lain, ada properti tertutup yang disetel ke true saat jendela ditutup.

Anda dapat menyetel pengatur waktu untuk memeriksa properti tertutup itu dan melakukannya seperti ini:

var win = window.open('foo.html', 'windowName',"width=200,height=200,scrollbars=no");   
var timer = setInterval(function() {   
    if(win.closed) {  
        clearInterval(timer);  
        alert('closed');  
    }  
}, 1000); 

Lihat contoh Fiddle yang berfungsi ini !


1
saya tidak ingin menggunakan timer! ada ide lain?
ArMaN

1
Agak hackish tapi saya pikir menggunakan timer akan bekerja paling baik di semua browser.
kay

Ini juga merupakan solusi terbaik jika pop-up memiliki beberapa halaman sebelum ditutup, karena peristiwa onunload hanya dipicu setelah pengguna keluar dari halaman pertama.
AntonChanning

14

di halaman anak Anda, letakkan ini:

<script type="text/javascript">
    function refreshAndClose() {
        window.opener.location.reload(true);
        window.close();
    }
</script>

dan

<body onbeforeunload="refreshAndClose();">

tetapi sebagai desain UI yang bagus, Anda harus menggunakan Close buttonkarena lebih ramah pengguna. lihat kode di bawah ini.

<script type="text/javascript">
    $(document).ready(function () {
        $('#btn').click(function () {
            window.opener.location.reload(true);
            window.close();
        });
    });
</script>

<input type='button' id='btn' value='Close' />

ketika jendela popup ditutup, bukan ketika pengguna mengklik tombol untuk menyegarkan halaman dan menutup jendela popup
gengkev

@ gengkev, saya tahu OP ingin melampirkan acara ke window close, tapi saya percaya menggunakan tombol adalah desain UI yang lebih baik. Namun, saya menyertakan kode untuk keduanya. mohon saran.
Ray Cheng

Saya menggunakan <body onbeforeunload = "refreshAndClose ();"> <script type = "text / javascript"> function refreshAndClose () {window.opener.location.reload (true); } self.close (); </script>
steve0nz

3

Saya menggunakan ini:

<script language='javascript'>
var t;
function doLoad() {
t = setTimeout("window.close()",1000);
}

</script>
<script type="text/javascript">
function refreshAndClose() {
    window.opener.location.reload(true);
    window.close();
}
</script>
<body onbeforeunload="refreshAndClose();" onLoad='doLoad()''>

ketika jendela menutupnya kemudian menyegarkan jendela induk.


2

window.open akan mengembalikan referensi ke jendela yang baru dibuat, asalkan URL yang dibuka sesuai dengan Kebijakan Asal yang Sama .

Ini harus bekerja:

function windowClose() {
    window.location.reload();
}

var foo = window.open("foo.html","windowName", "width=200,height=200,scrollbars=no");
foo.onbeforeunload= windowClose;​

Tidak akan berfungsi jika pengguna dapat mengikuti tautan di jendela yang terbuka. Dan saya cukup yakin acara unload dilemparkan sebelum URL target pertama kali dimuat, karena Anda secara implisit membiarkan about: kosong. (+1 untuk menyebutkan SOP)
kay

2

Dalam kasus saya, saya membuka jendela sembulan saat mengklik tombol tautan di halaman induk. Untuk menyegarkan orang tua saat menutup anak menggunakan

window.opener.location.reload();

di jendela anak menyebabkan membuka kembali jendela anak (Mungkin karena Status Tampilan saya kira. Perbaiki saya Jika saya salah). Jadi saya memutuskan untuk tidak memuat ulang halaman di induk dan memuat halaman itu lagi menetapkan url yang sama untuk itu.

Untuk menghindari popup terbuka lagi setelah menutup jendela pop up, ini mungkin membantu,

window.onunload = function(){
    window.opener.location = window.opener.location;};

1

Jika aplikasi Anda berjalan di browser yang mendukung HTML5. Anda dapat menggunakan postMessage . Contoh yang diberikan di sana sangat mirip dengan Anda.


"Jika tidak, Anda tidak dapat berkomunikasi di antara jendela yang berbeda." salah. Tekniknya masih memungkinkan, meskipun saya merekomendasikan jawaban dari @Moses
gengkev

-1 dihapus. Jika Anda memberikan contoh kecil, Anda bahkan akan mendapatkan +1 ;-)
kay

Lupakan. Tapi menurut saya window.opener tidak OK untuk IE. Saya akan mencoba.
Chris Li

1
@ Oke, berfungsi dengan baik di IE7, 8. Bagus sekali, saya tidak tahu sebelumnya. 1 untuk Musa.
Chris Li

1
@ArMaN: jsfiddle.net/8c2e4/10 , gunakan window.opener. Anda dapat menggunakan ini untuk menguji lingkungan Anda.
Chris Li

1

Coba ini

        self.opener.location.reload(); 

Buka induk jendela saat ini dan muat ulang lokasinya.


0

Anda dapat mencapai halaman utama dengan perintah induk (induk adalah jendela) setelah langkah Anda dapat membuat semuanya ...

    function funcx() {
        var result = confirm('bla bla bla.!');
        if(result)
            //parent.location.assign("http://localhost:58250/Ekocc/" + document.getElementById('hdnLink').value + "");
            parent.location.assign("http://blabla.com/" + document.getElementById('hdnLink').value + "");
    } 

0

Anda dapat menggunakan kode di bawah ini di halaman induk.

<script>
    window.onunload = refreshParent;
    function refreshParent() {
      window.opener.location.reload();
    }
</script>

0

Kode berikut akan mengatur untuk menyegarkan posting jendela induk tutup:

function ManageQB_PopUp() {
            $(document).ready(function () {
                window.close();
            });
            window.onunload = function () {
                var win = window.opener;
                if (!win.closed) {
                    window.opener.location.reload();
                }
            };
        }
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.