Objek window adalah objek tingkat atas dalam model objek browser JavaScript dan berisi beberapa metode dan properti umum:
1 Buka jendela baru
Copy kode kodenya sebagai berikut:
window.open(URL halaman,nama,parameter)
di dalam:
pageURL adalah jalur jendela anak
name adalah pegangan jendela anak
Parameter adalah parameter jendela (setiap parameter dipisahkan dengan koma)
menyukai:
Copy kode kodenya sebagai berikut:
window.open("http://www.cnblogs.com/zhouhb/","open",'height=100,width=400,top=0,left=0,toolbar=no,menubar=no,scrollbars= tidak,dapat diubah ukurannya=tidak,lokasi=tidak,status=tidak');
2 Buka jendela modal
Copy kode kodenya sebagai berikut:
window.showModalDialog("http://www.cnblogs.com/zhouhb/","open","toolbars=0;width=200;height=200");
3 Tutup jendela tanpa memunculkan kotak prompt
Jika halaman web tidak dibuka melalui program skrip (window.open()), sebelum memanggil skrip window.close() untuk menutup jendela, objek window.opener harus disetel ke null, jika tidak, browser (IE7, IE8) akan muncul OK Tutup kotak dialog.
Copy kode kodenya sebagai berikut:
<bahasa skrip="javaScript">
fungsi closeWindow()
{
jendela.pembuka = null;
jendela.open('', '_self', '');
jendela.tutup();
}
</skrip>
<input type='button' value='Tutup jendela' onClick="closeWindow()">
atau
<input type="button" value="Tutup jendela" onClick="window.opener = null;
window.open('', '_self', '');window.close()">
Untuk menutup jendela bingkai
Copy kode kodenya sebagai berikut:
<bahasa skrip="javaScript">
fungsi closeWindow()
{
jendela.pembuka = null;
jendela.open('', '_top', '');
window.parent.close();
}
</skrip>
4 penggunaan objek lokasi
Copy kode kodenya sebagai berikut:
window.location.reload();//Segarkan halaman saat ini
window.location.href="http://www.cnblogs.com/zhouhb/"; //Muat halaman lainnya
5 Penggunaan objek sejarah
Copy kode kodenya sebagai berikut:
window.history.go(1); //Maju
window.history.go(-1); //Kembali
6 Formulir anak meneruskan nilai ke formulir induk
6.1 Metode sederhana
(1) Buka subformulir di formulir induk
Copy kode kodenya sebagai berikut:
var str=window.showModalDialog("s.html");
jika(str!=nol)
{
var v=dokumen.getElementById("v");
v.nilai+=str;
}
(2) Kode subformulir
Copy kode kodenya sebagai berikut:
var v=dokumen.getElementById("v");
window.parent.returnValue=v.nilai;
jendela.tutup();
Selain itu, untuk jendela yang dibuka oleh showModalDialog, Anda juga dapat meneruskan nilai melalui dialogArguments:
Kode jendela induk:
Copy kode kodenya sebagai berikut:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<kepala>
<meta http-equiv="Jenis Konten" content="teks/html; charset=utf-8" />
<title>Dokumen Tanpa Judul</title>
<skrip tipe="teks/javascript">
fungsi dialog terbuka()
{
window.showModalDialog("child.html",window,"win","resable=false");//Di sini objek window dilewatkan sebagai parameter
}
</skrip>
</kepala>
<tubuh>
<bentuk>
<masukan tipe="teks" id="nama" />
<input type="button" id="open" value="open" onclick="opendialog()"/>
</bentuk>
</tubuh>
</html>
Kode subjendela:
Copy kode kodenya sebagai berikut:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<kepala>
<meta http-equiv="Jenis Konten" content="teks/html; charset=utf-8" />
<title>Dokumen Tanpa Judul</title>
<skrip tipe="teks/javascript">
fungsi pembaruanOrang Tua()
{
var pwin=window.dialogArguments;//Jendela anak mendapatkan parameter yang diteruskan
jika(pwin!=tidak terdefinisi)
{
pwin.document.getElementById("name").value=document.getElementById("name").value;
}
}
</skrip>
</kepala>
<tubuh>
<bentuk>
<masukan tipe="teks" id="nama" />
<input type="button" id="update" value="Perbarui jendela induk" onclick="updateParent()"/>
</bentuk>
</tubuh>
</html>
Untuk jendela yang dibuka oleh showModalDialog, Anda juga dapat meneruskan nilainya melalui window.returnValue:
Jendela utama:
Copy kode kodenya sebagai berikut:
<SCRIPT type="teks/javascript">
fungsi jendela terbuka(){
var bankCard=window.showModalDialog("counter.html","","dialogWidth=400px;dialogHeight=200px");
alert("Kata sandi kartu bank Anda adalah "+bankCard+"/n");
}
</SKRIP>
(2) Buka jendela
Copy kode kodenya sebagai berikut:
<KEPALA>
<META http-equiv="Jenis Konten" content="teks/html; charset=gb2312">
<TITLE>Latihan jendela</TITLE>
<SCRIPT type="teks/javascript" bahasa="javascript">
fungsi closeWindow(){
window.returnValue=document.myform.cardPass.value;
jendela.tutup();
}
</SKRIP>
</KEPALA>
<TUBUH>
<Nama FORMULIR = "formulir saya" tindakan = "" metode = "postingan">
Informasi akun:<BR>
Harap simpan informasi akun Anda dengan baik untuk menghindari kerugian<BR>
Nomor rekening: <INPUT name="cardNum" type="text" size="40"><BR>
Kata sandi: <MASUKKAN nama="cardPass" type="kata sandi" size="45"><BR>
<INPUT type="button" name="btn" value="Konfirmasi" onClick="closeWindow()">
</BENTUK>
</BODI>
6.2 Pengenalan yang lebih rinci
Seperti kita ketahui bersama, fungsi window.open() dapat digunakan untuk membuka jendela baru, lalu bagaimana cara meneruskan nilai ke formulir induk di formulir anak? Sebenarnya, Anda bisa mendapatkan referensi formulir induk melalui jendela .pembuka.
Misalnya, jika kita membuat formulir baru FatherPage.htm:
Copy kode kodenya sebagai berikut:
<skrip tipe="teks/javascript">
fungsiOpenChildWindow()
{
window.open('Halaman Anak.htm');
}
</skrip>
<masukan tipe="teks" id="txtInput" />
<input type="button" value="OpenChild" onclick="OpenChildWindow()" />
Kemudian di ChildPage.htm, Anda dapat mengakses elemen di formulir induk melalui window.opener:
Copy kode kodenya sebagai berikut:
<skrip tipe="teks/javascript">
fungsi SetNilai()
{
window.opener.document.getElementById('txtInput').nilai
=document.getElementById('txtInput').value;
jendela.tutup();
}
</skrip>
<masukan tipe="teks" id="txtInput" />
<input type="button" value="Setfather" onclick="SetValue()" />
Faktanya, saat membuka subformulir, kita juga dapat memberikan nilai pada elemen subformulir, karena fungsi window.open juga akan mengembalikan referensi ke subformulir tersebut, sehingga FatherPage.htm dapat dimodifikasi sebagai:
Copy kode kodenya sebagai berikut:
<skrip tipe="teks/javascript">
fungsiOpenChildWindow()
{
var anak = window.open('ChildPage.htm');
anak.dokumen.getElementById('txtInput').nilai
=document.getElementById('txtInput').value;
}
</skrip>
<masukan tipe="teks" id="txtInput" />
<input type="button" value="OpenChild" onclick="OpenChildWindow()" />
Dengan menentukan apakah referensi subformulir kosong, kita juga dapat mengontrolnya untuk membuka satu subformulir saja:
Copy kode kodenya sebagai berikut:
<skrip tipe="teks/javascript">
var anak
fungsiOpenChildWindow()
{
jika(!anak)
anak = window.open('Halaman Anak.htm');
anak.dokumen.getElementById('txtInput').nilai
=document.getElementById('txtInput').value;
}
</skrip>
<masukan tipe="teks" id="txtInput" />
<input type="button" value="OpenChild" onclick="OpenChildWindow()" />
Ini saja tidak cukup. Saat menutup form anak, variabel anak dari form induk juga harus dihapus. Jika tidak, form anak tidak dapat dibuka kembali setelah dibuka dan kemudian ditutup:
Copy kode kodenya sebagai berikut:
<tubuh onunload="Bongkar()">
<skrip tipe="teks/javascript">
fungsi SetNilai()
{
window.opener.document.getElementById('txtInput').nilai
=document.getElementById('txtInput').value;
jendela.tutup();
}
fungsiBongkar()
{
window.opener.child=null;
}
</skrip>
<masukan tipe="teks" id="txtInput" />
<input type="button" value="Setfather" onclick="SetValue()" />
</tubuh>