Dalam halaman berbingkai multi-jendela, interaksi informasi antar sub-jendela adalah hal biasa. Jika Anda mengklik hyperlink di jendela navigasi, bagaimana Anda membuka halaman web tertaut di jendela lain? Jika saya menekan tombol di jendela ini, bisakah saya menulis pesan di jendela lain? Ada begitu banyak jendela, bagaimana cara mengidentifikasinya? Silakan lihat contoh di bawah ini.
1. Klik link di jendela navigasi untuk membuka halaman web di jendela lain
Halaman satu frame yang ada seperti terlihat pada gambar di atas. Jendela A adalah logo website dan iklan, jendela B adalah bilah navigasi, dan jendela C adalah jendela yang menampilkan halaman tersebut. Kode sumber halaman berbingkai ini adalah:
| <framesetrows=20%,*> <framename=topFramescrolling=NOnoresizesrc=toppage.htm> <framesetcols=18%,*> <framename=leftFramenoresizesrc=leftpage.htm> <framename=mainFramesrc=halaman utama.htm> </bingkai> </bingkai> |
Jika halaman link (test.htm) di jendela B wajib dibuka di jendela C, maka link di jendela B harus ditulis sebagai berikut: <a herf=test.htm target=mailFrame> Halaman link ini seharusnya dibuka di jendela C. </a>, peran kunci di sini adalah parameter target di tag <A>. Jika Anda ingin membuka halaman web di jendela itu, atur nama jendela itu di parameter Target.
2. Tekan tombol di jendela B dan tulis sebaris teks di jendela C.
Format halaman contoh ini sama dengan contoh sebelumnya. Efek akhirnya adalah sebagai berikut: Setelah menekan tombol "Tulis di Jendela C" di jendela B, sebaris teks "Hai! Halo! Ini melalui Kata-kata yang ditulis untuk B kontrol jendela." Kode untuk halaman berbingkai dan file halaman web di setiap jendela sama dengan contoh di atas.
Metode persiapan:
1. Sisipkan program Javascript berikut di antara kode sumber <head> dan </head> halaman web C window (mainpage.htm):
| <scriptbahasa=Javascript> <!-- fungsi tes(){ document.write(Hai! Halo! Ini adalah kata yang ditulis melalui kontrol jendela B.) } --> </skrip> |
Fungsi program ini adalah untuk menulis teks di jendela saat ini.
2. Lalu bagaimana cara memanggil program di jendela C di jendela B? Pertama lihat kode sumber tombol "Write in Window C" di jendela B:
| <inputtype=buttonvalue=Tulis di jendela C onclick=parent.mainFrame.htest()> |
Dalam kode ini, kuncinya adalah kode "parent.mainFrame", yang memperkenalkan konsep baru - hubungan struktural jendela, yaitu, dalam halaman multi-jendela, hubungan antar jendela ditentukan oleh prinsip apa. Prinsip dalam menentukan hubungan jendela adalah: jendela yang dipisahkan dari jendela yang aktif adalah “jendela anak” (child window) dari jendela yang sedang dibuka, maka jendela yang sekarang ini adalah “jendela induk” (parent) dari jendela yang dibagi. Misalnya hubungan antar jendela pada contoh ini adalah sebagai berikut:
Seperti dapat dilihat dari tabel di atas, "jendela browser" adalah "jendela induk" dari "topFrame" dan "jendela bawah", dan jendela bawah adalah "jendela induk" dari dua jendela "leftFrame" dan "mainFrame ". Koneksi antara dua jendela harus melalui jendela induknya, jadi dalam contoh ini untuk memanggil "htest()" pada halaman web di jendela C, jelas melalui induk dari C dan B lalu ke mainFrame, dan lalu panggil program htest().
Jadi, jika kode untuk menulis teks dari jendela C ke jendela B seperti ini: onclick=parent.leftFrame.htest(); lalu tahukah Anda cara menulis kode untuk menulis sepotong teks dari jendela A ke jendela C ? Omong-omong, itu saja: onclick=grandchildren.mainFrame.htest().
Seperti dapat dilihat dari contoh di atas, masalah utama dalam pertukaran informasi antar windows adalah memahami hubungan antar windows, dan operasi lainnya relatif sederhana.